{"version":3,"sources":["styleguide/components/Cards/StaticHighlightCard/StaticHighlightCardGrid/StaticHighlightCardGrid.tsx","styleguide/components/Cards/StaticHighlightCard/StaticHighlightBoxCard/StaticHighlightBoxCard.tsx","styleguide/components/Cards/StaticHighlightCard/StaticHighlightBoxCard/index.ts","styleguide/components/Cards/StaticHighlightCard/StaticHighlightRecipeGroupCard/StaticHighlightRecipeGroupCard.tsx","styleguide/components/Cards/StaticHighlightCard/StaticHighlightRecipeGroupCard/index.ts","styleguide/components/Cards/StaticHighlightCard/StaticHighlightCard.tsx","common/components/Widgets/StaticContentHighlight.tsx","common/components/Widgets/ProductHighlight.tsx","styleguide/components/Links/HighlightedLink/HighlightedLink.tsx","common/components/Oddlygood/OddlySubTitle.tsx","common/components/Oddlygood/OddlyWrapper.tsx","common/components/Oddlygood/OddlyWrapperInner.tsx","common/components/Widgets/components/WidgetText.tsx","styleguide/components/Cards/ProductCard/ProductCard.tsx","styleguide/components/Cards/RecipeCardGrid/RecipeCardGrid.tsx"],"names":["StaticHighlightCardGridWrapper","styled_components_browser_esm","div","withConfig","displayName","componentId","templateObject_1","Object","tslib_es6","StaticHighlightCard_StaticHighlightCardGrid_StaticHighlightCardGrid","_a","children","react","StaticHighlightBoxWrapper","a","templateObject_3","helpers","tablet","StaticHighlightBoxCard_templateObject_1","desktop1440","templateObject_2","TextWrapper","templateObject_4","Title","templateObject_5","props","theme","typography","heading","colors","white","StaticHighlightCard_StaticHighlightBoxCard","imgSrc","altText","title","link","href","LazyImage","src","alt","StaticHighlightRecipeGroupCardContent","HighlightCardContent","StaticHighlightRecipeGroupCard_templateObject_1","Text","p","StaticHighlightRecipeGroupCard_templateObject_3","fonts","secondary","bodyText","StaticHighlightRecipeGroupCard_templateObject_2","StaticHighlightCard_StaticHighlightRecipeGroupCard","isSmall","hasBorder","print","badgeText","text","rest","HighlightCardWrapper","HighlightCardImage","StaticHighlightCard_StaticHighlightCard","style","defaultProps","Cards_StaticHighlightCard_StaticHighlightCard","StaticHighlightSectionWrapper","General","StaticContentHighlight_templateObject_1","StaticContentHighlight_StaticContentHighlight","_super","StaticContentHighlight","prototype","componentDidMount","this","routing","settings","isMock","pathname","siteUrlId","services","sites","undefined","fetchStaticHighlights","resourceUrl","render","widgetId","highlights","disableWrapper","length","renderCards","id","isHighlighted","isFullWidth","MediumHeader","className","greyed","tagName","_this","staticBadgeText","cardStyle","slice","map","i","imageUrl","linkText","linkUrl","key","getImagePresetSizes","image","url","media","width","__webpack_exports__","es","_b","resource","app","mockHighlights","staticHighlights","static_highlights","StyledProductHighlightWrapper","styled_components__WEBPACK_IMPORTED_MODULE_2__","tslib__WEBPACK_IMPORTED_MODULE_0__","styleguide_helpers_media__WEBPACK_IMPORTED_MODULE_6__","OddlygoodStyledProductHighlightWrapper","WidgetHeader","styleguide_components_Typography_MediumHeader_MediumHeader__WEBPACK_IMPORTED_MODULE_5__","StyledProductHighlightItemContainer","templateObject_7","useUpperMargin","templateObject_6","layoutName","size","_General__WEBPACK_IMPORTED_MODULE_8__","react_redux__WEBPACK_IMPORTED_MODULE_10__","state","siteTheme","_App_services__WEBPACK_IMPORTED_MODULE_11__","language","common_selectors_localeSelector__WEBPACK_IMPORTED_MODULE_13__","_Routing_Routable__WEBPACK_IMPORTED_MODULE_7__","resourceItems","additionalLink","additionalLinkText","onLinkClick","headerTagName","useLazyImages","displayedProducts","background_1","_Oddlygood_OddlyWrapper__WEBPACK_IMPORTED_MODULE_15__","White","Tertiary","react__WEBPACK_IMPORTED_MODULE_1__","common_contexts_ContentThemeContext__WEBPACK_IMPORTED_MODULE_12__","Consumer","contentTheme","background","_Oddlygood_OddlyWrapperInner__WEBPACK_IMPORTED_MODULE_16__","desktopPadding","_Oddlygood_OddlySubTitle__WEBPACK_IMPORTED_MODULE_14__","type","Primary","_components_WidgetText__WEBPACK_IMPORTED_MODULE_9__","styleguide_components_Cards_ProductCard_ProductCard__WEBPACK_IMPORTED_MODULE_3__","imagePresetSuffix","isNovelty","productName","useImagePresets","onClick","useLazyImage","useLargeTextSize","styleguide_components_Buttons_OutlinedButton_OutlinedButtonLink__WEBPACK_IMPORTED_MODULE_4__","buttonStyle","color","StyledHighlightedLink","wrapText","primary","intense","selectedItemBackground","brandPrimaryFeatureBackground","brandPrimary","OddlySubTitleType","Title3","h1","simple","TitleInner","span","styleguide_helpers_media__WEBPACK_IMPORTED_MODULE_3__","phone560","realType","backgroundColor","styleguide_themes_oddlygood__WEBPACK_IMPORTED_MODULE_4__","greenPesto","foregroundColor","Extra1","blockOrange","Extra2","blockPurple","Simple","transparent","OddlyWrapperBackground","OddlyWrapper","styled_components__WEBPACK_IMPORTED_MODULE_1__","styleguide_themes_oddlygood__WEBPACK_IMPORTED_MODULE_3__","Secondary","limeGreen","neutralGray","styleguide_helpers_media__WEBPACK_IMPORTED_MODULE_2__","phone","grid","gutterInPx","desktop1200","gutter","OddlyWrapperInner","_OddlyWrapper__WEBPACK_IMPORTED_MODULE_4__","tabletPadding","desktop","desktop1100","WidgetText","ProductCardWrapper","_Card__WEBPACK_IMPORTED_MODULE_5__","ProductCardImageWrapper","styledVariations","productCardImage","StyledProductCardTitle","templateObject_8","_helpers__WEBPACK_IMPORTED_MODULE_3__","ProductCard","common_contexts_ContentThemeContext__WEBPACK_IMPORTED_MODULE_8__","renderImage","_Icons_AspectGroupIcons_NoveltyIcon__WEBPACK_IMPORTED_MODULE_6__","forProduct","_components_LazyImage__WEBPACK_IMPORTED_MODULE_4__","_PicturesAndVideos_Image__WEBPACK_IMPORTED_MODULE_7__","sizes","suffix","srcSet","join","getImagePreset","preset","RecipeCardGridWrapper","templateObject_16","layout","indexOf","templateObject_11","templateObject_9","templateObject_10","templateObject_15","templateObject_12","templateObject_13","templateObject_14","RecipeCardGrid"],"mappings":"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","file":"static/js/product~recipe~widget.41a23652.chunk.js","sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\n\r\nconst StaticHighlightCardGridWrapper = styled.div`\r\n\tdisplay: flex;\r\n\tflex-direction: row;\r\n\talign-items: center;\r\n\tjustify-content: center;\r\n\tflex-wrap: wrap;\r\n\twidth: 100%;\r\n`;\r\n\r\nconst StaticHighlightCardGrid: React.FC = ({ children }) => {\r\n\treturn <StaticHighlightCardGridWrapper>{children}</StaticHighlightCardGridWrapper>;\r\n};\r\n\r\nexport default StaticHighlightCardGrid;\r\n","import * as React from 'react';\r\nimport { media } from '../../../../helpers';\r\nimport { LazyImage } from '../../../LazyImage';\r\nimport { StaticHighlightCardProps } from '../interfaces';\r\nimport styled from 'styled-components';\r\n\r\nconst StaticHighlightBoxWrapper = styled.a`\r\n\tmax-width: 355px;\r\n\tmax-height: 234px;\r\n\tposition: relative;\r\n\tdisplay: block;\r\n\toverflow: hidden;\r\n\tflex: 1 0 100%;\r\n\r\n\t& + & {\r\n\t\tmargin: 10px 0 0;\r\n\t}\r\n\r\n\t${media.tablet`\r\n\t\tflex: 1 0 calc(50% - 5px);\r\n\r\n\t\t& + & {\r\n\t\t\tmargin: 0 0 0 10px;\r\n\t\t}\r\n\t`};\r\n\r\n\t${media.desktop1440`\r\n\t\tflex: 1 0 calc(50% - 10px);\r\n\t\tmax-width: 534px;\r\n\t\t& + & {\r\n\t\t\tmargin: 0 0 0 20px;\r\n\t\t}\r\n\t`};\r\n\r\n\t> img {\r\n\t\tmin-width: 100%;\r\n\t}\r\n`;\r\n\r\nconst TextWrapper = styled.div`\r\n\tmax-width: 80%;\r\n\tposition: absolute;\r\n\tbottom: 20%;\r\n\tleft: 5%;\r\n`;\r\n\r\nconst Title = styled.div`\r\n\t${props => props.theme.typography.heading};\r\n\tfont-size: 24px;\r\n\tfont-style: normal;\r\n\tfont-stretch: normal;\r\n\tline-height: 1.08;\r\n\tletter-spacing: normal;\r\n\ttext-align: left;\r\n\tcolor: ${props => props.theme.colors.white};\r\n\ttext-shadow: 0 2px 24px rgba(0, 0, 0, 0.5);\r\n`;\r\n\r\nconst StaticHighlightBoxCard: React.FC<StaticHighlightCardProps> = ({ imgSrc, altText, title, link }) => {\r\n\treturn (\r\n\t\t<StaticHighlightBoxWrapper href={link}>\r\n\t\t\t<LazyImage src={imgSrc} alt={altText} />\r\n\t\t\t<TextWrapper>\r\n\t\t\t\t<Title>{title}</Title>\r\n\t\t\t</TextWrapper>\r\n\t\t</StaticHighlightBoxWrapper>\r\n\t);\r\n};\r\n\r\nexport default StaticHighlightBoxCard;\r\n","import StaticHighlightBoxCard from './StaticHighlightBoxCard';\r\nexport default StaticHighlightBoxCard;\r\n","import * as React from 'react';\r\nimport HighlightCardWrapper, { HighlightCardWrapperProps } from '../../Card/HighlightCardWrapper';\r\nimport HighlightCardImage from '../../Card/HighlightCardImage';\r\nimport HighlightCardContent from '../../Card/HighlightCardContent';\r\nimport { StaticHighlightCardProps } from '../interfaces';\r\nimport { media } from '../../../../helpers';\r\nimport styled from 'styled-components';\r\n\r\nconst StaticHighlightRecipeGroupCardContent = styled(HighlightCardContent)`\r\n\tjustify-content: flex-start;\r\n`;\r\n\r\nconst Text = styled.p`\r\n\tfont-family: ${props => props.theme.fonts.secondary};\r\n\tfont-size: 13px;\r\n\tline-height: 15px;\r\n\tcolor: ${props => props.theme.colors.bodyText};\r\n\tmargin: 2px 0 0;\r\n\tdisplay: -webkit-box;\r\n\t-webkit-line-clamp: 2;\r\n\t-webkit-box-orient: vertical;\r\n\toverflow: hidden;\r\n\r\n\t${media.tablet`\r\n\t\tdisplay: block;\r\n\t\t-webkit-line-clamp: none;\r\n\t\tfont-size: 15px;\r\n\t\tline-height: 18px;\r\n\t\tmargin-top: 5px;\r\n\t`};\r\n`;\r\n\r\nconst StaticHighlightRecipeGroupCard: React.FC<StaticHighlightCardProps &\r\n\tHighlightCardWrapperProps &\r\n\tReact.HTMLAttributes<HTMLAnchorElement>> = ({\r\n\tisSmall,\r\n\thasBorder,\r\n\tprint,\r\n\tlink,\r\n\taltText,\r\n\tbadgeText,\r\n\ttitle,\r\n\ttext,\r\n\timgSrc,\r\n\t...rest\r\n}) => {\r\n\treturn (\r\n\t\t<HighlightCardWrapper hasBorder={true} href={link} {...rest}>\r\n\t\t\t<HighlightCardImage\r\n\t\t\t\tisSmall={isSmall}\r\n\t\t\t\thasBorder={hasBorder}\r\n\t\t\t\taltText={altText}\r\n\t\t\t\timgSrc={imgSrc}\r\n\t\t\t\tbadgeText={badgeText}\r\n\t\t\t/>\r\n\t\t\t<StaticHighlightRecipeGroupCardContent isSmall={isSmall} title={title}>\r\n\t\t\t\t{text && <Text>{text}</Text>}\r\n\t\t\t</StaticHighlightRecipeGroupCardContent>\r\n\t\t</HighlightCardWrapper>\r\n\t);\r\n};\r\n\r\nexport default StaticHighlightRecipeGroupCard;\r\n","import StaticHighlightRecipeGroupCard from './StaticHighlightRecipeGroupCard';\r\nexport default StaticHighlightRecipeGroupCard;\r\n","import * as React from 'react';\r\nimport StaticHighlightBoxCard from './StaticHighlightBoxCard';\r\nimport StaticHighlightRecipeGroupCard from './StaticHighlightRecipeGroupCard';\r\nimport { StaticHighlightCardProps } from './interfaces';\r\n\r\nconst StaticHighlightCard: React.FC<StaticHighlightCardProps> = ({ style, ...rest }) => {\r\n\tswitch (style) {\r\n\t\tcase 'recipegroup':\r\n\t\t\treturn <StaticHighlightRecipeGroupCard {...rest} />;\r\n\t\tdefault:\r\n\t\t\treturn <StaticHighlightBoxCard {...rest} />;\r\n\t}\r\n};\r\n\r\nStaticHighlightCard.defaultProps = {\r\n\tstyle: 'box',\r\n};\r\n\r\nexport default StaticHighlightCard;\r\n","import * as React from 'react';\r\nimport { Section, ContentWrapper } from '../General';\r\nimport MediumHeader from 'styleguide/components/Typography/MediumHeader/MediumHeader';\r\nimport StaticHighlightCardGrid from 'styleguide/components/Cards/StaticHighlightCard/StaticHighlightCardGrid/StaticHighlightCardGrid';\r\nimport StaticHighlightCard from 'styleguide/components/Cards/StaticHighlightCard/StaticHighlightCard';\r\nimport { ImageSource } from 'styleguide/interfaces/imgInterfaces';\r\nimport styled from 'styled-components';\r\nimport { connect, MapStateToProps } from 'react-redux';\r\nimport { StaticContentHighlightConfiguration, StaticHighlight } from './interfaces/StaticContentHighlight';\r\nimport { staticHighlightActions } from 'common/components/Widgets/reducers/static-highlights';\r\nimport { State } from '../../reducers';\r\nimport { getSiteUrlId, WithAppSettings } from '../App/services';\r\nimport { RoutingState } from '../Routing/reducers';\r\n\r\nexport interface StaticContentHighlightProps extends WithAppSettings {\r\n\twidgetId?: string;\r\n\thighlights: StaticHighlight[];\r\n\trouting: RoutingState;\r\n}\r\n\r\nconst StaticHighlightSectionWrapper = styled(Section)`\r\n\tdisplay: block;\r\n\tpadding: 50px 0 60px;\r\n\r\n\t.medium-header {\r\n\t\tmargin-top: 0;\r\n\t}\r\n`;\r\n\r\ninterface StaticContentHighlightOwnProps {\r\n\tisMock?: boolean;\r\n\tmockHighlights?: StaticHighlight[];\r\n}\r\n\r\ntype Props = StaticContentHighlightOwnProps &\r\n\tStaticContentHighlightConfiguration &\r\n\tStaticContentHighlightProps &\r\n\tStaticContentHighlightDispatchProps;\r\n\r\nclass StaticContentHighlight extends React.Component<Props> {\r\n\tpublic componentDidMount() {\r\n\t\tconst { routing, settings, isMock } = this.props;\r\n\t\tif (routing.pathname && !isMock) {\r\n\t\t\tconst siteUrlId = settings ? getSiteUrlId(routing, settings.sites) : undefined;\r\n\t\t\tthis.props.fetchStaticHighlights({ siteUrlId: siteUrlId || '', resourceUrl: routing.pathname });\r\n\t\t}\r\n\t}\r\n\r\n\tpublic render() {\r\n\t\tconst { widgetId, highlights, title, disableWrapper } = this.props;\r\n\r\n\t\tif (highlights.length < 1) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\tif (disableWrapper) {\r\n\t\t\treturn this.renderCards();\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t<StaticHighlightSectionWrapper id={widgetId} isHighlighted={true} isFullWidth={true}>\r\n\t\t\t\t<ContentWrapper>\r\n\t\t\t\t\t{title && (\r\n\t\t\t\t\t\t<MediumHeader className=\"medium-header\" greyed={true} tagName=\"h3\">\r\n\t\t\t\t\t\t\t{title}\r\n\t\t\t\t\t\t</MediumHeader>\r\n\t\t\t\t\t)}\r\n\t\t\t\t\t<StaticHighlightCardGrid>{this.renderCards()}</StaticHighlightCardGrid>\r\n\t\t\t\t</ContentWrapper>\r\n\t\t\t</StaticHighlightSectionWrapper>\r\n\t\t);\r\n\t}\r\n\r\n\tpublic renderCards() {\r\n\t\tconst { highlights, staticBadgeText, cardStyle } = this.props;\r\n\r\n\t\tconst visibleHighlights = highlights.slice(0, 2);\r\n\r\n\t\treturn visibleHighlights.map(({ imageUrl, title, text, linkText, linkUrl }, i) => (\r\n\t\t\t<StaticHighlightCard\r\n\t\t\t\tkey={i}\r\n\t\t\t\timgSrc={this.getImagePresetSizes(imageUrl)}\r\n\t\t\t\ttitle={title}\r\n\t\t\t\taltText={linkText}\r\n\t\t\t\tlink={linkUrl}\r\n\t\t\t\ttext={text}\r\n\t\t\t\tbadgeText={staticBadgeText}\r\n\t\t\t\tstyle={cardStyle}\r\n\t\t\t/>\r\n\t\t));\r\n\t}\r\n\r\n\tprivate getImagePresetSizes(image: string): string | ImageSource[] {\r\n\t\tconst { cardStyle } = this.props;\r\n\r\n\t\tswitch (cardStyle) {\r\n\t\t\tcase 'recipegroup':\r\n\t\t\t\treturn `${image}/358x231-recipe-highlight`;\r\n\r\n\t\t\tdefault:\r\n\t\t\t\treturn [\r\n\t\t\t\t\t{\r\n\t\t\t\t\t\turl: `${image}/534x234-static-highlight`,\r\n\t\t\t\t\t\tmedia: 'desktop1440',\r\n\t\t\t\t\t\twidth: 1440,\r\n\t\t\t\t\t},\r\n\t\t\t\t\t{\r\n\t\t\t\t\t\turl: `${image}/355x234-static-highlight`,\r\n\t\t\t\t\t\tmedia: 'desktop',\r\n\t\t\t\t\t\twidth: 1000,\r\n\t\t\t\t\t},\r\n\t\t\t\t];\r\n\t\t}\r\n\t}\r\n}\r\n\r\nexport interface StaticContentHighlightDispatchProps {\r\n\tfetchStaticHighlights: typeof staticHighlightActions.fetchStaticHighlights;\r\n}\r\n\r\nconst mapStateToProps: MapStateToProps<StaticContentHighlightProps, StaticContentHighlightOwnProps, State> = (\r\n\t{ resource, routing, app },\r\n\t{ isMock, mockHighlights }\r\n): StaticContentHighlightProps => {\r\n\treturn {\r\n\t\thighlights: isMock ? mockHighlights || [] : resource.staticHighlights,\r\n\t\trouting,\r\n\t\tsettings: app.settings,\r\n\t};\r\n};\r\n\r\nexport default connect(mapStateToProps, {\r\n\tfetchStaticHighlights: staticHighlightActions.fetchStaticHighlights,\r\n})(StaticContentHighlight);\r\n","import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport ProductCard from 'styleguide/components/Cards/ProductCard/ProductCard';\r\nimport OutlinedButtonLink from 'styleguide/components/Buttons/OutlinedButton/OutlinedButtonLink';\r\nimport MediumHeader from 'styleguide/components/Typography/MediumHeader/MediumHeader';\r\nimport { media } from 'styleguide/helpers/media';\r\nimport { ProductCardSizes } from 'styleguide/components/Cards/ProductCard/ProductCard';\r\nimport { ProductHighlightConfiguration, ProductHighlightLayouts } from './interfaces/ProductHighlight';\r\nimport injectRoutable, { InjectedRoutableProps } from '../Routing/Routable';\r\nimport { productCardGridStyles } from '../General';\r\nimport WidgetText from './components/WidgetText';\r\nimport { WidgetCommonProps } from './interfaces/interfaces';\r\nimport { Theme } from 'styleguide/themes/theme';\r\nimport { MapStateToProps, connect } from 'react-redux';\r\nimport { State } from 'common/reducers';\r\nimport { getThemeForResource } from '../App/services';\r\nimport { ContentThemeContext } from 'common/contexts/ContentThemeContext';\r\nimport { localeSelector } from 'common/selectors/localeSelector';\r\nimport OddlySubTitle, { OddlySubTitleType } from '../Oddlygood/OddlySubTitle';\r\nimport OddlyWrapper, { OddlyWrapperBackground } from '../Oddlygood/OddlyWrapper';\r\nimport OddlyWrapperInner from '../Oddlygood/OddlyWrapperInner';\r\n\r\nconst StyledProductHighlightWrapper = styled.div`\r\n\tdisplay: flex;\r\n\tflex-direction: column;\r\n\talign-items: center;\r\n\tpadding: 5px 0 50px;\r\n\twidth: 100%;\r\n\r\n\t${media.tablet`\r\n\t\tpadding: 50px 0 60px;\r\n\t`};\r\n\r\n\t.medium-header {\r\n\t\tmargin-top: 0;\r\n\t\ttext-align: center;\r\n\t}\r\n\r\n\t.product-highlights-text {\r\n\t\tmargin: 0 0 20px;\r\n\t}\r\n`;\r\n\r\nconst OddlygoodStyledProductHighlightWrapper = styled.div`\r\n\tdisplay: flex;\r\n\tflex-direction: column;\r\n\talign-items: center;\r\n\tpadding: 20px 0 20px;\r\n\twidth: 100%;\r\n\r\n\t${media.tablet`\r\n\t\tpadding: 20px 0 20px;\r\n\t`};\r\n\r\n\t.medium-header {\r\n\t\tmargin-top: 0;\r\n\t\ttext-align: center;\r\n\t}\r\n\r\n\t.product-highlights-text {\r\n\t\tmargin: 0 0 20px;\r\n\t}\r\n`;\r\n\r\nconst WidgetHeader = styled(MediumHeader)`\r\n\tmax-width: 720px;\r\n`;\r\n\r\nconst StyledProductHighlightItemContainer = styled.div<{\r\n\tlayoutName?: ProductHighlightLayouts;\r\n\tsize?: ProductCardSizes;\r\n\tuseUpperMargin?: boolean;\r\n}>`\r\n\twidth: 100%;\r\n\tmax-width: 1200px;\r\n\tdisplay: flex;\r\n\tflex-wrap: wrap;\r\n\tflex-direction: row;\r\n\talign-items: stretch;\r\n\tjustify-content: center;\r\n\tmargin: 0 -3px 30px;\r\n\r\n\t${({ useUpperMargin }) => useUpperMargin && 'margin-top: 15px'};\r\n\r\n\t${media.desktop1440`\r\n\t\tmin-width: 1040px;\r\n\t`};\r\n\r\n\t${({ layoutName, size }) => productCardGridStyles(layoutName, size)};\r\n`;\r\n\r\ntype OwnProps = WidgetCommonProps & ProductHighlightConfiguration;\r\n\r\nconst ProductHighlight: React.FC<OwnProps & ProductHighlightStateProps & InjectedRoutableProps> = ({\r\n\twidgetId,\r\n\ttitle,\r\n\ttext,\r\n\tresourceItems,\r\n\tadditionalLink,\r\n\tadditionalLinkText,\r\n\tlayoutName,\r\n\tonLinkClick,\r\n\theaderTagName,\r\n\tuseLazyImages,\r\n\tsiteTheme,\r\n\tlanguage,\r\n}) => {\r\n\tconst displayedProducts = resourceItems || [];\r\n\r\n\tlet size: ProductCardSizes | undefined;\r\n\tif (layoutName === 'fourColumn') {\r\n\t\tsize = 'medium';\r\n\t}\r\n\tif (layoutName === 'threeColumn' || siteTheme === 'oddlygood' || layoutName === 'oddlygood3c') {\r\n\t\tsize = 'large';\r\n\t}\r\n\r\n\t// =============================\r\n\t// ODDLYGOOD LAYOUT\r\n\t// =============================\r\n\tif (layoutName === 'oddlygood' || layoutName === 'oddlygood3c') {\r\n\t\tconst background = layoutName === 'oddlygood3c' ? OddlyWrapperBackground.White : OddlyWrapperBackground.Tertiary;\r\n\r\n\t\treturn (\r\n\t\t\t<ContentThemeContext.Consumer>\r\n\t\t\t\t{contentTheme => (\r\n\t\t\t\t\t<OddlyWrapper background={background}>\r\n\t\t\t\t\t\t<OddlyWrapperInner background={background} desktopPadding={1}>\r\n\t\t\t\t\t\t\t<OddlygoodStyledProductHighlightWrapper id={widgetId}>\r\n\t\t\t\t\t\t\t\t{title && <OddlySubTitle title={title} type={OddlySubTitleType.Primary} />}\r\n\r\n\t\t\t\t\t\t\t\t{text && <WidgetText className=\"product-highlights-text\">{text}</WidgetText>}\r\n\r\n\t\t\t\t\t\t\t\t<StyledProductHighlightItemContainer layoutName={layoutName} size={size} useUpperMargin={true}>\r\n\t\t\t\t\t\t\t\t\t{displayedProducts.map((p, i) => {\r\n\t\t\t\t\t\t\t\t\t\treturn (\r\n\t\t\t\t\t\t\t\t\t\t\t<ProductCard\r\n\t\t\t\t\t\t\t\t\t\t\t\tkey={i}\r\n\t\t\t\t\t\t\t\t\t\t\t\timageUrl={p.imageUrl}\r\n\t\t\t\t\t\t\t\t\t\t\t\timagePresetSuffix={'product-thumbnail'}\r\n\t\t\t\t\t\t\t\t\t\t\t\tisNovelty={p.isNovelty}\r\n\t\t\t\t\t\t\t\t\t\t\t\tsize={size}\r\n\t\t\t\t\t\t\t\t\t\t\t\tproductName={p.title}\r\n\t\t\t\t\t\t\t\t\t\t\t\tuseImagePresets={true}\r\n\t\t\t\t\t\t\t\t\t\t\t\turl={p.url}\r\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"product-card\"\r\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={onLinkClick}\r\n\t\t\t\t\t\t\t\t\t\t\t\tuseLazyImage={useLazyImages}\r\n\t\t\t\t\t\t\t\t\t\t\t\tuseLargeTextSize={siteTheme === 'oddlygood'}\r\n\t\t\t\t\t\t\t\t\t\t\t\tlanguage={language}\r\n\t\t\t\t\t\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t\t\t})}\r\n\t\t\t\t\t\t\t\t</StyledProductHighlightItemContainer>\r\n\t\t\t\t\t\t\t\t{additionalLink && additionalLinkText && (\r\n\t\t\t\t\t\t\t\t\t<OutlinedButtonLink href={additionalLink} buttonStyle=\"secondary\">\r\n\t\t\t\t\t\t\t\t\t\t{additionalLinkText}\r\n\t\t\t\t\t\t\t\t\t</OutlinedButtonLink>\r\n\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t</OddlygoodStyledProductHighlightWrapper>\r\n\t\t\t\t\t\t</OddlyWrapperInner>\r\n\t\t\t\t\t</OddlyWrapper>\r\n\t\t\t\t)}\r\n\t\t\t</ContentThemeContext.Consumer>\r\n\t\t);\r\n\t}\r\n\r\n\t// =============================\r\n\t// OTHER LAYOUTS\r\n\t// =============================\r\n\treturn (\r\n\t\t<ContentThemeContext.Consumer>\r\n\t\t\t{contentTheme => (\r\n\t\t\t\t<StyledProductHighlightWrapper id={widgetId}>\r\n\t\t\t\t\t<WidgetHeader className=\"medium-header\" tagName={headerTagName} color={contentTheme.color}>\r\n\t\t\t\t\t\t{title}\r\n\t\t\t\t\t</WidgetHeader>\r\n\r\n\t\t\t\t\t{text && <WidgetText className=\"product-highlights-text\">{text}</WidgetText>}\r\n\r\n\t\t\t\t\t<StyledProductHighlightItemContainer layoutName={layoutName} size={size}>\r\n\t\t\t\t\t\t{displayedProducts.map((p, i) => {\r\n\t\t\t\t\t\t\treturn (\r\n\t\t\t\t\t\t\t\t<ProductCard\r\n\t\t\t\t\t\t\t\t\tkey={i}\r\n\t\t\t\t\t\t\t\t\timageUrl={p.imageUrl}\r\n\t\t\t\t\t\t\t\t\timagePresetSuffix={'product-thumbnail'}\r\n\t\t\t\t\t\t\t\t\tisNovelty={p.isNovelty}\r\n\t\t\t\t\t\t\t\t\tsize={size}\r\n\t\t\t\t\t\t\t\t\tproductName={p.title}\r\n\t\t\t\t\t\t\t\t\tuseImagePresets={true}\r\n\t\t\t\t\t\t\t\t\turl={p.url}\r\n\t\t\t\t\t\t\t\t\tclassName=\"product-card\"\r\n\t\t\t\t\t\t\t\t\tonClick={onLinkClick}\r\n\t\t\t\t\t\t\t\t\tuseLazyImage={useLazyImages}\r\n\t\t\t\t\t\t\t\t\tuseLargeTextSize={siteTheme === 'oddlygood'}\r\n\t\t\t\t\t\t\t\t\tlanguage={language}\r\n\t\t\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t})}\r\n\t\t\t\t\t</StyledProductHighlightItemContainer>\r\n\t\t\t\t\t{additionalLink && additionalLinkText && (\r\n\t\t\t\t\t\t<OutlinedButtonLink href={additionalLink} color={contentTheme.color}>\r\n\t\t\t\t\t\t\t{additionalLinkText}\r\n\t\t\t\t\t\t</OutlinedButtonLink>\r\n\t\t\t\t\t)}\r\n\t\t\t\t</StyledProductHighlightWrapper>\r\n\t\t\t)}\r\n\t\t</ContentThemeContext.Consumer>\r\n\t);\r\n};\r\n\r\ninterface ProductHighlightStateProps {\r\n\tsiteTheme?: Theme;\r\n\tlanguage: string;\r\n}\r\n\r\nconst mapStateToProps: MapStateToProps<ProductHighlightStateProps, OwnProps, State> = (\r\n\tstate: State\r\n): ProductHighlightStateProps => {\r\n\tconst { app, routing, resource } = state;\r\n\tconst sites = app.settings?.sites || [];\r\n\tconst siteTheme = sites.length > 0 ? getThemeForResource(routing, sites, resource) : undefined;\r\n\tconst locale = localeSelector(state);\r\n\treturn {\r\n\t\tsiteTheme,\r\n\t\tlanguage: locale,\r\n\t};\r\n};\r\n\r\nexport default connect(mapStateToProps)(injectRoutable(ProductHighlight));\r\n","import * as React from 'react';\r\nimport styled from 'styled-components';\r\n\r\nconst StyledHighlightedLink = styled('a')<HighlightedLinkProps>`\r\n\tborder-radius: 17px;\r\n\tfont-weight: 800;\r\n\tfont-size: 13px;\r\n\tline-height: 14px;\r\n\ttext-align: center;\r\n\tpadding: 5px 12px;\r\n\ttext-decoration: none;\r\n\twhite-space: ${props => (props.wrapText ? 'normal' : 'nowrap')};\r\n\tdisplay: inline-block;\r\n\tfont-family: ${props => props.theme.fonts.primary};\r\n\tcursor: pointer;\r\n\tbackground-color: ${props =>\r\n\t\tprops.intense ? props.theme.colors.selectedItemBackground : props.theme.colors.brandPrimaryFeatureBackground};\r\n\tcolor: ${props => (props.intense ? props.theme.colors.brandPrimary : props.theme.colors.linkText)};\r\n\tborder: 1px solid\r\n\t\t${props =>\r\n\t\t\tprops.intense ? props.theme.colors.selectedItemBackground : props.theme.colors.brandPrimaryFeatureBackground};\r\n\r\n\t&:hover {\r\n\t\tborder-color: ${props => props.theme.colors.linkText};\r\n\t\tbackground-color: ${props => props.theme.colors.white};\r\n\t\ttext-decoration: none;\r\n\t}\r\n`;\r\n\r\nexport interface HighlightedLinkProps {\r\n\tintense?: boolean;\r\n\twrapText?: boolean;\r\n}\r\n\r\nconst HighlightedLink: React.FC<HighlightedLinkProps & React.AnchorHTMLAttributes<HTMLAnchorElement>> = props => {\r\n\treturn <StyledHighlightedLink {...props}>{props.children}</StyledHighlightedLink>;\r\n};\r\n\r\nexport default HighlightedLink;\r\n","import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { media } from 'styleguide/helpers/media';\r\nimport { themeColors } from 'styleguide/themes/oddlygood';\r\n\r\nexport enum OddlySubTitleType {\r\n\tPrimary,\r\n\tExtra1,\r\n\tExtra2,\r\n\tSimple,\r\n}\r\n\r\ninterface Title3Props {\r\n\tsimple?: boolean;\r\n}\r\n\r\nconst Title3 = styled.h1<Title3Props>`\r\n\t${({ theme }) => theme.typography.heading};\r\n\tfont-size: 34px;\r\n\tline-height: 1;\r\n\ttext-transform: uppercase;\r\n\r\n\t${({ simple }) =>\r\n\t\t!simple &&\r\n\t\t`\r\n\t\ttext-align: center;\r\n\t\tdisplay: flex;\r\n\t\tflex-direction: column;\r\n\t\tjustify-content: center;\r\n\t\talign-items: center;\r\n\t\tmargin: 0;\r\n\t\t& span {\r\n\t\t\tmargin: 5px;\r\n\t\t}\r\n\t\t`}\r\n\t${({ simple }) =>\r\n\t\tsimple &&\r\n\t\t`\r\n\t\tmargin-bottom: 8px;\r\n\t\tpadding: 0;\r\n\t`}\r\n`;\r\n\r\ninterface TitleInnerProps {\r\n\tbackground: string;\r\n\tcolor: string;\r\n\tsimple?: boolean;\r\n}\r\n\r\nconst TitleInner = styled.span<TitleInnerProps>`\r\n\t${media.phone560`\r\n    font-size: 40px;\r\n  `};\r\n\tfont-size: 30px;\r\n\tmargin: 5px 10px 5px 0px;\r\n\t${({ simple }) =>\r\n\t\t!simple &&\r\n\t\t`\r\n\t\tpadding: 10px 25px 10px 25px;\r\n\t`}\r\n\tbackground-color: ${({ background }) => background};\r\n\tcolor: ${({ color }) => color};\r\n`;\r\n\r\ninterface OddlyTitleProps {\r\n\ttitle: string;\r\n\ttype?: OddlySubTitleType;\r\n}\r\n\r\nconst OddlySubTitle: React.FunctionComponent<OddlyTitleProps> = ({ title, type }) => {\r\n\tconst realType = type || OddlySubTitleType.Primary;\r\n\tlet backgroundColor = themeColors.greenPesto;\r\n\tlet foregroundColor = themeColors.white;\r\n\tlet simple = false;\r\n\tswitch (realType) {\r\n\t\tcase OddlySubTitleType.Extra1:\r\n\t\t\tbackgroundColor = themeColors.blockOrange;\r\n\t\t\tbreak;\r\n\t\tcase OddlySubTitleType.Extra2:\r\n\t\t\tbackgroundColor = themeColors.blockPurple;\r\n\t\t\tbreak;\r\n\t\tcase OddlySubTitleType.Simple:\r\n\t\t\tbackgroundColor = themeColors.transparent;\r\n\t\t\tforegroundColor = themeColors.greenPesto;\r\n\t\t\tsimple = true;\r\n\t\t\tbreak;\r\n\t}\r\n\r\n\treturn (\r\n\t\t<Title3 simple={simple}>\r\n\t\t\t<TitleInner simple={simple} color={foregroundColor} background={backgroundColor}>\r\n\t\t\t\t{title}\r\n\t\t\t</TitleInner>\r\n\t\t</Title3>\r\n\t);\r\n};\r\n\r\nexport default OddlySubTitle;\r\n","import styled from 'styled-components';\r\nimport { media, mediaBreakpoints } from 'styleguide/helpers/media';\r\nimport { themeColors } from 'styleguide/themes/oddlygood';\r\n\r\nexport enum OddlyWrapperBackground {\r\n\tPrimary,\r\n\tSecondary,\r\n\tTertiary,\r\n\tWhite,\r\n}\r\n\r\nexport interface OddlyWrapperProps {\r\n\tbackground?: OddlyWrapperBackground;\r\n\twidth?: string;\r\n}\r\n\r\nconst OddlyWrapper = styled.div<OddlyWrapperProps>`\r\n\tbackground-color: ${({ background }) => {\r\n\t\tswitch (background) {\r\n\t\t\tdefault:\r\n\t\t\tcase OddlyWrapperBackground.Primary:\r\n\t\t\t\treturn `${themeColors.greenPesto}`;\r\n\t\t\tcase OddlyWrapperBackground.Secondary:\r\n\t\t\t\treturn `${themeColors.limeGreen}`;\r\n\t\t\tcase OddlyWrapperBackground.Tertiary:\r\n\t\t\t\treturn `${themeColors.neutralGray}`;\r\n\t\t\tcase OddlyWrapperBackground.White:\r\n\t\t\t\treturn `${themeColors.white}`;\r\n\t\t}\r\n\t}};\r\n\r\n\t${({ width }) => width && `width: ${width};`}\r\n\r\n\t${media.phone`\r\n    margin: 0 -${({ theme }) => theme.grid.gutterInPx(2)} 0 -${({ theme }) => theme.grid.gutterInPx(2)};\r\n  `};\r\n\r\n\t@media (min-width: ${mediaBreakpoints.desktop1200}px) {\r\n\t\tmargin: 0 calc((100vw - 1200px) / -2 - ${({ theme }) => theme.grid.gutter - 0.5}px);\r\n\t}\r\n`;\r\n\r\nexport default OddlyWrapper;\r\n","import styled from 'styled-components';\r\nimport { mediaBreakpoints } from 'styleguide/helpers/media';\r\n// import { media, mediaBreakpoints } from 'styleguide/helpers/media';\r\nimport { themeColors } from 'styleguide/themes/oddlygood';\r\nimport { OddlyWrapperBackground } from './OddlyWrapper';\r\n\r\nexport interface OddlyWrapperInnerProps {\r\n\tbackground?: OddlyWrapperBackground;\r\n\tdesktopPadding?: number;\r\n\ttabletPadding?: number;\r\n}\r\n\r\nconst OddlyWrapperInner = styled.div<OddlyWrapperInnerProps>`\r\n\tbackground-color: ${({ background }) => {\r\n\t\tswitch (background) {\r\n\t\t\tdefault:\r\n\t\t\tcase OddlyWrapperBackground.Primary:\r\n\t\t\t\treturn `${themeColors.greenPesto}`;\r\n\t\t\tcase OddlyWrapperBackground.Secondary:\r\n\t\t\t\treturn `${themeColors.limeGreen}`;\r\n\t\t\tcase OddlyWrapperBackground.Tertiary:\r\n\t\t\t\treturn `${themeColors.neutralGray}`;\r\n\t\t\tcase OddlyWrapperBackground.White:\r\n\t\t\t\treturn `${themeColors.white}`;\r\n\t\t}\r\n\t}};\r\n\tcolor: ${({ background }) => {\r\n\t\tswitch (background) {\r\n\t\t\tdefault:\r\n\t\t\tcase OddlyWrapperBackground.Primary:\r\n\t\t\t\treturn `${themeColors.white}`;\r\n\t\t\tcase OddlyWrapperBackground.Secondary:\r\n\t\t\tcase OddlyWrapperBackground.Tertiary:\r\n\t\t\t\treturn `${themeColors.greenPesto}`;\r\n\t\t\tcase OddlyWrapperBackground.White:\r\n\t\t\t\treturn `${themeColors.greenPesto}`;\r\n\t\t}\r\n\t}};\r\n\r\n\tpadding-bottom: 10px;\r\n\r\n\t@media (min-width: ${mediaBreakpoints.tablet}px) {\r\n\t\tpadding-bottom: ${({ tabletPadding }) => (tabletPadding ? `${tabletPadding}px` : `0px`)};\r\n\t}\r\n\r\n\t@media (min-width: ${mediaBreakpoints.desktop}px) {\r\n\t\tpadding-bottom: ${({ desktopPadding }) => (desktopPadding ? `${desktopPadding}px` : `120px`)};\r\n\t}\r\n\r\n\t@media (min-width: ${mediaBreakpoints.desktop1100}px) {\r\n\t\tpadding-bottom: ${({ desktopPadding }) => (desktopPadding ? `${desktopPadding}px` : `200px`)};\r\n\t}\r\n`;\r\n\r\nexport default OddlyWrapperInner;\r\n","import styled from 'styled-components';\r\nimport { media } from 'styleguide/helpers/media';\r\n\r\nconst WidgetText = styled.p<{}>`\r\n\twidth: 100%;\r\n\tmax-width: 720px;\r\n\tfont-size: 15px;\r\n\tfont-family: ${props => props.theme.fonts.secondary};\r\n\tcolor: ${props => props.theme.colors.bodyText};\r\n\tmargin-left: auto;\r\n\tmargin-right: auto;\r\n\r\n\t${media.desktop`\r\n  \tmax-width: 600px;\r\n    font-size: 18px;\r\n    padding: 0;\r\n  `};\r\n\r\n\t${media.desktop1440`\r\n  \tmax-width: 720px;\r\n  `};\r\n`;\r\n\r\nexport default WidgetText;\r\n","import * as React from 'react';\r\nimport { Component } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { media, mediaBreakpoints } from '../../../helpers';\r\nimport { ProductCardInterface } from '../../../interfaces';\r\nimport { LazyImage } from '../../../components/LazyImage';\r\nimport { CardTitle, CardWrapper } from '../Card';\r\nimport NoveltyIcon from '../../Icons/AspectGroupIcons/NoveltyIcon';\r\nimport { CardWrapperProps } from '../Card/CardWrapper';\r\nimport Image from '../../PicturesAndVideos/Image';\r\nimport { ContentThemeContext } from 'common/contexts/ContentThemeContext';\r\n\r\nconst BORDER_RADIUS = 3; // px\r\n\r\nconst ProductCardWrapper = styled(CardWrapper)<\r\n\tProductCardProps & CardWrapperProps & React.AnchorHTMLAttributes<HTMLAnchorElement>\r\n>`\r\n\tmax-width: ${({ size }) => (size === 'small' ? '174px' : 'none')};\r\n`;\r\n\r\nconst ProductCardImageWrapper = styled('div')<ProductCardProps>`\r\n\tborder-radius: ${BORDER_RADIUS}px ${BORDER_RADIUS}px 0 0;\r\n\ttext-align: center;\r\n\tmargin: 0 auto;\r\n\tposition: relative;\r\n\r\n\t${({ theme, size }) => theme.styledVariations.productCardImage(size)};\r\n\r\n\t& > img {\r\n\t\twidth: 100%;\r\n\t\theight: 100%;\r\n\t}\r\n\r\n\t> .novelty-icon {\r\n\t\tposition: absolute;\r\n\r\n\t\t${props => {\r\n\t\t\tif (props.size === 'medium' || props.size === 'large') {\r\n\t\t\t\treturn css`\r\n\t\t\t\t\tleft: -30px;\r\n\t\t\t\t\tbottom: -10px;\r\n\t\t\t\t\twidth: 80px;\r\n\t\t\t\t\theight: 80px;\r\n\t\t\t\t`;\r\n\t\t\t}\r\n\t\t\treturn css`\r\n\t\t\t\tleft: -20px;\r\n\t\t\t\tbottom: -5px;\r\n\t\t\t\twidth: 60px;\r\n\t\t\t\theight: 60px;\r\n\t\t\t`;\r\n\t\t}};\r\n\t}\r\n`;\r\n\r\nconst StyledProductCardTitle = styled(CardTitle)<{ useLargeTextSize?: boolean }>`\r\n\ttext-align: center;\r\n\tposition: relative;\r\n\toverflow: hidden;\r\n\tword-break: unset;\r\n\tbackground: transparent;\r\n\r\n\t${({ useLargeTextSize }) => {\r\n\t\tif (useLargeTextSize) {\r\n\t\t\treturn css`\r\n\t\t\t\tfont-size: 16px;\r\n\r\n\t\t\t\t${media.phone`\r\n\t\t\t\t\tfont-size: 18px;\r\n\t\t\t\t`};\r\n\t\t\t`;\r\n\t\t}\r\n\t\treturn null;\r\n\t}};\r\n\r\n\t${media.phone`\r\n\t\tjustify-content: flex-start;\r\n\t`};\r\n`;\r\n\r\nexport type ProductCardSizes = 'small' | 'medium' | 'large';\r\n\r\ninterface ProductCardProps {\r\n\tsize?: ProductCardSizes;\r\n\tuseLazyImage?: boolean;\r\n\tuseImagePresets?: boolean;\r\n\tuseLargeTextSize?: boolean;\r\n\tlanguage?: string | null;\r\n}\r\n\r\ntype Props = ProductCardProps & ProductCardInterface & React.AnchorHTMLAttributes<HTMLAnchorElement>;\r\n\r\nclass ProductCard extends Component<Props> {\r\n\tpublic static defaultProps = {\r\n\t\tuseLazyImage: true,\r\n\t\tsize: 'small',\r\n\t};\r\n\r\n\tpublic render() {\r\n\t\tconst { size, url, imageUrl, productName, className, isNovelty, useLargeTextSize, language, ...rest } = this.props;\r\n\t\treturn (\r\n\t\t\t<ContentThemeContext.Consumer>\r\n\t\t\t\t{contentTheme => (\r\n\t\t\t\t\t<ProductCardWrapper {...rest} href={url} size={size} className={`product-card ${className ? className : ''}`}>\r\n\t\t\t\t\t\t<ProductCardImageWrapper className=\"product-card__image-wrapper\" size={size}>\r\n\t\t\t\t\t\t\t{this.renderImage()}\r\n\t\t\t\t\t\t\t{!!isNovelty && <NoveltyIcon className=\"novelty-icon\" language={language} forProduct={true} />}\r\n\t\t\t\t\t\t</ProductCardImageWrapper>\r\n\t\t\t\t\t\t<StyledProductCardTitle\r\n\t\t\t\t\t\t\tuseLargeTextSize={useLargeTextSize}\r\n\t\t\t\t\t\t\tclassName=\"product-card__name\"\r\n\t\t\t\t\t\t\tcolor={contentTheme.color}>\r\n\t\t\t\t\t\t\t{productName}\r\n\t\t\t\t\t\t</StyledProductCardTitle>\r\n\t\t\t\t\t</ProductCardWrapper>\r\n\t\t\t\t)}\r\n\t\t\t</ContentThemeContext.Consumer>\r\n\t\t);\r\n\t}\r\n\r\n\tprivate renderImage() {\r\n\t\tconst { imageUrl, imagePresetSuffix, productName, useImagePresets, size, useLazyImage } = this.props;\r\n\t\tif (!useImagePresets || typeof imageUrl !== 'string') {\r\n\t\t\tif (useLazyImage) {\r\n\t\t\t\treturn <LazyImage src={imageUrl} alt={productName} />;\r\n\t\t\t}\r\n\t\t\treturn <Image src={imageUrl} alt={productName} />;\r\n\t\t}\r\n\r\n\t\tconst suffix = imagePresetSuffix ? `-${imagePresetSuffix}` : '';\r\n\t\tlet srcSet = [\r\n\t\t\t`${imageUrl}/100x100${suffix} 1x`,\r\n\t\t\t`${imageUrl}/140x140${suffix} 1.5x`,\r\n\t\t\t`${imageUrl}/200x200${suffix} 2x`,\r\n\t\t];\r\n\t\tlet sizes;\r\n\r\n\t\tif (size === 'medium' || size === 'large') {\r\n\t\t\tsrcSet = [\r\n\t\t\t\t`${imageUrl}/100x100${suffix} 100w`,\r\n\t\t\t\t`${imageUrl}/140x140${suffix} 140w`,\r\n\t\t\t\t`${imageUrl}/200x200${suffix} 200w`,\r\n\t\t\t\t`${imageUrl}/200x200${suffix} 2x`,\r\n\t\t\t];\r\n\t\t}\r\n\r\n\t\tif (size === 'medium') {\r\n\t\t\tsizes = [\r\n\t\t\t\t`(max-width: ${mediaBreakpoints.desktop - 1}) 100px`,\r\n\t\t\t\t`(min-width: ${mediaBreakpoints.desktop}) 140px`,\r\n\t\t\t\t'140px',\r\n\t\t\t];\r\n\t\t}\r\n\r\n\t\tif (size === 'large') {\r\n\t\t\tsizes = [\r\n\t\t\t\t`(max-width: ${mediaBreakpoints.tablet - 1}) 100px`,\r\n\t\t\t\t`(min-width: ${mediaBreakpoints.tablet}) 140px`,\r\n\t\t\t\t`(min-width: ${mediaBreakpoints.desktop}) 200px`,\r\n\t\t\t\t'200px',\r\n\t\t\t];\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t<LazyImage src={imageUrl}>\r\n\t\t\t\t<img\r\n\t\t\t\t\tsrcSet={srcSet.join(',')}\r\n\t\t\t\t\tsizes={sizes && sizes.join(',')}\r\n\t\t\t\t\tsrc={`${imageUrl}${this.getImagePreset()}`}\r\n\t\t\t\t\talt={productName}\r\n\t\t\t\t/>\r\n\t\t\t</LazyImage>\r\n\t\t);\r\n\t}\r\n\r\n\tprivate getImagePreset() {\r\n\t\tconst { imagePresetSuffix, size, useImagePresets } = this.props;\r\n\r\n\t\tif (!useImagePresets) {\r\n\t\t\treturn '';\r\n\t\t}\r\n\r\n\t\tconst suffix = imagePresetSuffix ? `-${imagePresetSuffix}` : '';\r\n\r\n\t\tlet preset = '100x100';\r\n\t\tif (size === 'medium') {\r\n\t\t\tpreset = '140x140';\r\n\t\t}\r\n\t\tif (size === 'large') {\r\n\t\t\tpreset = '200x200';\r\n\t\t}\r\n\r\n\t\treturn `/${preset}${suffix}`;\r\n\t}\r\n}\r\n\r\nexport default ProductCard;\r\n","import * as React from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { media } from '../../../helpers';\r\n\r\nconst RecipeCardGridWrapper = styled('div')<RecipeCardGridProps>`\r\n\tmax-width: 1200px;\r\n\tdisplay: flex;\r\n\tflex-wrap: wrap;\r\n\tflex-direction: row;\r\n\talign-items: stretch;\r\n\tjustify-content: center;\r\n\tmargin: -10px -5px;\r\n\twidth: 100%;\r\n\theight: 100%;\r\n\r\n\t${props => {\r\n\t\tif (props.layout === 'threeColumn') {\r\n\t\t\treturn css`\r\n\t\t\t\t${media.desktop`\r\n\t\t\t\t\tmargin: -15px;\r\n\t\t\t\t`};\r\n\r\n\t\t\t\t${media.desktop1440`\r\n\t\t\t\t\tmargin: -20px;\r\n\t\t\t\t`};\r\n\t\t\t`;\r\n\t\t}\r\n\t\treturn css`\r\n\t\t\tmargin: -10px -5px;\r\n\t\t`;\r\n\t}};\r\n\r\n\t.recipe-card {\r\n\t\t/* IE */\r\n\t\tflex: 0 1 174px;\r\n\t\tflex: 0 1 calc(50% - 10px);\r\n\t\twidth: 174px;\r\n\t\twidth: calc(50% - 10px);\r\n\t\tmargin: 10px 5px;\r\n\r\n\t\t${media.tablet<RecipeCardGridProps>`\r\n\t\t\t${props => {\r\n\t\t\t\tif (props.layout && ['threeColumn', 'fourColumn'].indexOf(props.layout) > -1) {\r\n\t\t\t\t\treturn css`\r\n\t\t\t\t\t\tflex: 0 1 calc(100% / 3 - 10px);\r\n\t\t\t\t\t\twidth: calc(100% / 3 - 10px);\r\n\t\t\t\t\t`;\r\n\t\t\t\t}\r\n\t\t\t\treturn css`\r\n\t\t\t\t\twidth: calc(100% / 2 - 10px);\r\n\t\t\t\t`;\r\n\t\t\t}};\r\n\r\n\t\t`};\r\n\r\n\t\t${media.desktop<RecipeCardGridProps>`\r\n\t\t\t/* IE */\r\n\t\t\tflex: 0 1 174px;\r\n\r\n\t\t\t${props => {\r\n\t\t\t\tif (props.layout === 'threeColumn') {\r\n\t\t\t\t\treturn css`\r\n\t\t\t\t\t\tmargin: 15px;\r\n\t\t\t\t\t\tflex: 0 1 calc(${100 / 3}% - 30px);\r\n\t\t\t\t\t\twidth: calc(${100 / 3}% - 30px);\r\n\t\t\t\t\t`;\r\n\t\t\t\t}\r\n\t\t\t\tif (props.layout === 'fourColumn') {\r\n\t\t\t\t\treturn css`\r\n\t\t\t\t\t\tflex: 0 1 calc(${100 / 4}% - 10px);\r\n\t\t\t\t\t\twidth: calc(${100 / 4}% - 10px);\r\n\t\t\t\t\t`;\r\n\t\t\t\t}\r\n\t\t\t\treturn css`\r\n\t\t\t\t\tflex: 0 1 calc(${100 / 5}% - 10px);\r\n\t\t\t\t\twidth: calc(${100 / 5}% - 10px);\r\n\t\t\t\t`;\r\n\t\t\t}};\r\n\t\t`};\r\n\r\n\t\t${media.desktop1440<RecipeCardGridProps>`\r\n\t\t\t/* IE */\r\n\t\t\tflex: 0 1 174px;\r\n\r\n\t\t\t${props => {\r\n\t\t\t\tif (props.layout === 'threeColumn') {\r\n\t\t\t\t\treturn css`\r\n\t\t\t\t\t\tmargin: 20px;\r\n\t\t\t\t\t\tflex: 0 1 calc(${100 / 3}% - 40px);\r\n\t\t\t\t\t\twidth: calc(${100 / 3}% - 40px);\r\n\t\t\t\t\t`;\r\n\t\t\t\t}\r\n\t\t\t\tif (props.layout === 'fourColumn') {\r\n\t\t\t\t\treturn css`\r\n\t\t\t\t\t\tflex: 0 1 calc(${100 / 4}% - 10px);\r\n\t\t\t\t\t\twidth: calc(${100 / 1}% - 10px);\r\n\t\t\t\t\t`;\r\n\t\t\t\t}\r\n\t\t\t\treturn css`\r\n\t\t\t\t\tflex: 0 1 calc(${100 / 6}% - 10px);\r\n\t\t\t\t\twidth: calc(${100 / 6}% - 10px);\r\n\t\t\t\t`;\r\n\t\t\t}};\r\n\t\t`};\r\n\t}\r\n`;\r\n\r\ninterface RecipeCardGridProps {\r\n\tlayout?: 'list' | 'fourColumn' | 'threeColumn';\r\n}\r\n\r\nconst RecipeCardGrid: React.FC<RecipeCardGridProps & React.HTMLAttributes<HTMLDivElement>> = ({ layout, children }) => {\r\n\treturn <RecipeCardGridWrapper layout={layout}>{children}</RecipeCardGridWrapper>;\r\n};\r\n\r\nRecipeCardGrid.defaultProps = {\r\n\tlayout: 'list',\r\n};\r\n\r\nexport default RecipeCardGrid;\r\n"],"sourceRoot":""}