{"version":3,"sources":["Shared/Breadcrumb/Breadcrumb.tsx","Shared/Icons/CheckIcon.tsx","Shared/ContentContainer/ContentContainer.tsx","ProductPage/AttributeArea.tsx","ProductPage/ProductImagesContainer.tsx","ProductPage/ProductPage.tsx","Shared/Icons/ArrowLeftIconPrimary.tsx"],"names":["BreadcrumbContainer","styled","div","position","top","theme","desktopHeaderHeight","fontSize","beta","left","right","margin","x","maxWidth","screenMaxWidth","width","paddingTop","alignItems","display","paddingLeft","lineHeight","letterSpacing","SelectedSpan","span","fontWeight","bold","LinkText","textDecoration","BreadcrumbLink","KexLink","opacity","color","breadText","Seperator","normal","Breadcrumb","breadcrumb","useMedia","mediaQuery","mediaMinLarge","map","link","index","length","key","text","href","compose","Svg","xmlns","viewBox","css","fill","d","stroke","strokeWidth","strokeLinecap","strokeLinejoin","ContentContainer","children","style","rest","Container","contentMaxWidth","padding","y","none","StyledLoadingCircle","LoadingCircle","white","height","gamma","xy","bottom","ButtonText","transition","property","duration","timingFunction","pseudo","visibility","Heading","h1","spacing","font","size","psi","weight","tight","wider","black","media","zeta","BrandAndCategory","p","middleGray","textTransform","marginTop","StockStatus","marginBottom","StyledCheckIcon","CheckIcon","marginLeft","ItemAddedText","justifyContent","StockStatusCircle","borderRadius","backgroundColor","notInStockRed","marginRight","inStockGreen","StockStatusText","alpha","InformationListItem","ListItemTitle","headerMainLink","ListItem","StyledDivider","Divider","grayLine","delta","mediaMaxMedium","PriceContainer","theta","MainPriceContainer","QuantityPriceWrapper","Price","nearGreat","PerPackageText","QuantityText","QuantityTextBold","AddToCart","QuantitySelector","MinusButton","button","cursor","QuantityInput","input","textAlign","MozAppearance","WebkitAppearance","StyledPlusIcon","PlusToggleIcon","StyledMinusIcon","MinusToggleIcon","AddToCartButton","CtaButton","moreLarge","ProductAttrListWrapper","whiteSpace","AttrContainerWrapper","mediaMinSmall","AttributeArea","variation","totalPrice","eanCode","articleNumber","price","inStock","quantity","unitPrice","code","recommendedPrice","productPage","bookingNumber","planogramInputQuantity","useState","inputQuantity","setInputQuantity","isLoading","setIsLoading","itemAdded","setItemAdded","useAppSettingsData","translations","addToCartLabel","articleNumberLabel","eanCodeLabel","productSizeLabel","inStockLabel","notInStockLabel","addedToCartLabel","quantityLabel","perPackageLabel","unitPriceLabel","pieceLabel","recommendedPriceLabel","currencyLabel","languageRoute","mainCategory","displayName","data-instock","disabled","onClick","type","min","max","value","onChange","e","target","Number","onBlur","numb","UpdateCart","setTimeout","data-isloading","MainImageDiv","paddingBottom","filter","shadows","productImageShadow","MainImage","img","maxHeight","productImageMaxHeight","objectFit","mediaMinMedium","ProductImagesContainer","flexDirection","thumbnailImageHeight","timings","threeTenths","image","toggleModal","mediaMaxSmall","src","alt","BackLinkWrapper","ArrowLeftIcon","ArrowLeftIconPrimary","linkColor","BackLink","Section","section","primaryBackground","large","great","Top","gridTemplateColumns","gridGap","mediaMinHuge","massive","ProductImage","gridColumn","start","end","ModalProductImage","ProductPage","productPageData","useCurrentPage","backToPlanogramLabel","productPlaceholderImg","placeholderImages","productPlaceholder","variationCollection","sliderImages","planogramUrl","transform"],"mappings":"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","file":"Dist/build-client/static/js/ProductPage-ProductPage.4d0a84c9.chunk.js","sourcesContent":["import React from 'react';\r\nimport KexLink from '../../Shared/KexLink/KexLink';\r\nimport { styled, theme } from '../../../Features/Theme';\r\nimport Link from '../../Shared/Models/Link.interface';\r\nimport useMedia from '../Hooks/useMedia';\r\n\r\ntype PropTypes = {\r\n breadcrumb: Link[];\r\n};\r\n\r\nfunction Breadcrumb({ breadcrumb }: PropTypes) {\r\n const isDesktop = useMedia(theme.mediaQuery.mediaMinLarge);\r\n return isDesktop ? (\r\n \r\n {breadcrumb.map((link, index) =>\r\n breadcrumb.length === index + 1 ? (\r\n
\r\n {link.text}\r\n
\r\n ) : (\r\n \r\n {link.text}\r\n / \r\n \r\n )\r\n )}\r\n
\r\n ) : (\r\n <>\r\n );\r\n}\r\n\r\nconst BreadcrumbContainer = styled.div({\r\n position: 'absolute',\r\n top: theme.desktopHeaderHeight,\r\n fontSize: theme.beta,\r\n left: 0,\r\n right: 0,\r\n margin: { x: 'auto' },\r\n maxWidth: theme.screenMaxWidth,\r\n width: '100%',\r\n paddingTop: '18px',\r\n alignItems: 'center',\r\n display: 'flex',\r\n paddingLeft: '32px',\r\n lineHeight: 1.33,\r\n letterSpacing: 0.45,\r\n});\r\n\r\nconst SelectedSpan = styled.span({\r\n fontWeight: theme.fontWeight.bold,\r\n lineHeight: 1.33,\r\n});\r\n\r\nconst LinkText = styled.span({\r\n textDecoration: 'underline',\r\n});\r\n\r\nconst BreadcrumbLink = styled(KexLink, {\r\n display: 'flex',\r\n opacity: 0.9,\r\n color: theme.breadText,\r\n});\r\n\r\nconst Seperator = styled.span({\r\n margin: { x: '6px' },\r\n fontWeight: theme.fontWeight.normal,\r\n textDecoration: 'none',\r\n});\r\n\r\nexport default Breadcrumb;\r\n","import React from 'react';\r\nimport { styled, StyledProps } from '@glitz/react';\r\n\r\nfunction CartIcon({ compose }: StyledProps) {\r\n return (\r\n \r\n \r\n \r\n );\r\n}\r\n\r\nexport default styled(CartIcon);\r\n","import React from 'react';\r\nimport { styled, theme } from '../../Theme';\r\nimport { StyleOrStyleArray } from '@glitz/type';\r\n\r\ntype PropType = {\r\n children: React.ReactNode;\r\n style?: StyleOrStyleArray;\r\n};\r\n\r\nfunction ContentContainer({ children, style, ...rest }: PropType) {\r\n return (\r\n \r\n {children}\r\n \r\n );\r\n}\r\n\r\nexport default ContentContainer;\r\n\r\nconst Container = styled.div({\r\n width: '100%',\r\n maxWidth: theme.contentMaxWidth,\r\n margin: {\r\n x: 'auto',\r\n },\r\n padding: {\r\n y: theme.none,\r\n },\r\n});\r\n","import React, { useState } from 'react';\r\n\r\nimport { styled, theme } from '../Theme';\r\nimport { UpdateCart } from '../Cart/Cart';\r\nimport IProductPage from './Models/ProductPageModel.interface';\r\nimport { useAppSettingsData } from '../Shared/AppSettingsProvider/AppSettingsProvider';\r\nimport { media, pseudo } from '@glitz/core';\r\nimport { LoadingCircle } from '../Shared/Icons';\r\nimport CtaButton from '../Shared/CtaButton/CtaButton';\r\nimport PlusToggleIcon from '../Shared/Icons/PlusToggleIcon';\r\nimport MinusToggleIcon from '../Shared/Icons/MinusToggleIcon';\r\nimport Divider from '../Shared/Divider/Divider';\r\nimport { mediaQuery } from '../Theme/mediaQueries';\r\nimport VariationModel from '../KexVariation/Models/VariationModel.interface';\r\nimport CheckIcon from '../Shared/Icons/CheckIcon';\r\n\r\ntype AttributeArea = {\r\n productPage: IProductPage;\r\n variation: VariationModel;\r\n bookingNumber: string;\r\n planogramInputQuantity: number;\r\n};\r\n\r\nfunction AttributeArea({\r\n variation: {\r\n totalPrice,\r\n eanCode,\r\n size,\r\n price,\r\n articleNumber,\r\n inStock,\r\n quantity,\r\n unitPrice,\r\n code,\r\n recommendedPrice,\r\n },\r\n productPage,\r\n bookingNumber,\r\n planogramInputQuantity,\r\n}: AttributeArea) {\r\n const [inputQuantity, setInputQuantity] = useState(\r\n planogramInputQuantity\r\n );\r\n const [isLoading, setIsLoading] = useState(false);\r\n const [itemAdded, setItemAdded] = useState(false);\r\n\r\n const {\r\n translations: {\r\n 'productPage/addToCart': addToCartLabel,\r\n 'productPage/articleNumber': articleNumberLabel,\r\n 'productPage/eanCode': eanCodeLabel,\r\n 'productPage/size': productSizeLabel,\r\n 'productPage/inStock': inStockLabel,\r\n 'productPage/notInStock': notInStockLabel,\r\n 'productPage/addedToCart': addedToCartLabel,\r\n 'common/quantity': quantityLabel,\r\n 'common/perPackage': perPackageLabel,\r\n 'common/unitPrice': unitPriceLabel,\r\n 'common/piece': pieceLabel,\r\n 'productPage/recommendedPrice': recommendedPriceLabel,\r\n 'common/currency': currencyLabel,\r\n },\r\n languageRoute,\r\n } = useAppSettingsData();\r\n\r\n const onInputChange = (value: string) => {\r\n if (Number(value) < 0) {\r\n setInputQuantity(1);\r\n return;\r\n }\r\n setInputQuantity(Number(value));\r\n };\r\n\r\n const onInputBlur = (numb: string) => {\r\n Number(numb) < 1 && setInputQuantity(1);\r\n };\r\n\r\n const addToCart = () => {\r\n const updated = UpdateCart(\r\n code,\r\n inputQuantity,\r\n languageRoute,\r\n bookingNumber ? bookingNumber : '',\r\n setIsLoading\r\n );\r\n if (updated) {\r\n setItemAdded(true);\r\n setTimeout(() => {\r\n setItemAdded(false);\r\n }, 2000);\r\n }\r\n };\r\n\r\n return (\r\n \r\n {productPage.mainCategory}\r\n {productPage.displayName}\r\n \r\n {inStock ? (\r\n <>\r\n \r\n {inStockLabel}\r\n \r\n ) : (\r\n <>\r\n \r\n {notInStockLabel}\r\n \r\n )}\r\n \r\n
\r\n \r\n {articleNumber && (\r\n <>\r\n \r\n {articleNumberLabel}{' '}\r\n {articleNumber}\r\n \r\n \r\n \r\n )}\r\n {eanCode && (\r\n <>\r\n \r\n {eanCodeLabel}{' '}\r\n {eanCode}\r\n \r\n \r\n \r\n )}\r\n {size && (\r\n <>\r\n \r\n {productSizeLabel}{' '}\r\n {size}\r\n \r\n \r\n \r\n )}\r\n {recommendedPrice && (\r\n <>\r\n \r\n {recommendedPriceLabel}{' '}\r\n {recommendedPrice}\r\n \r\n \r\n \r\n )}\r\n
\r\n {inStock && (\r\n <>\r\n \r\n \r\n {totalPrice}\r\n /{perPackageLabel}\r\n \r\n
\r\n \r\n \r\n {quantityLabel}/{perPackageLabel}: \r\n \r\n \r\n {quantity}\r\n {pieceLabel}\r\n \r\n \r\n \r\n {unitPriceLabel}: \r\n \r\n {unitPrice}\r\n {currencyLabel}\r\n \r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n setInputQuantity(inputQuantity - 1)}\r\n >\r\n \r\n \r\n onInputChange(e.target.value)}\r\n onBlur={e => onInputBlur(e.target.value)}\r\n />\r\n \r\n \r\n addToCart()}>\r\n \r\n {addToCartLabel}\r\n \r\n {isLoading && }\r\n {itemAdded && !isLoading && (\r\n \r\n {addedToCartLabel}\r\n \r\n \r\n )}\r\n \r\n \r\n
\r\n \r\n )}\r\n \r\n
\r\n );\r\n}\r\n\r\nconst StyledLoadingCircle = styled(LoadingCircle, {\r\n color: theme.white,\r\n height: theme.gamma,\r\n margin: { xy: 'auto' },\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n right: 0,\r\n bottom: 0,\r\n});\r\n\r\nconst ButtonText = styled.span({\r\n transition: {\r\n property: 'all',\r\n duration: '0.2s',\r\n timingFunction: 'linear',\r\n },\r\n ...pseudo([':nth-child(n)[data-isloading=\"true\"]'], {\r\n visibility: 'hidden',\r\n opacity: 0,\r\n }),\r\n});\r\n\r\nconst Heading = styled.h1({\r\n padding: {\r\n bottom: theme.spacing(5),\r\n },\r\n font: {\r\n size: theme.psi,\r\n weight: theme.fontWeight.bold,\r\n },\r\n lineHeight: theme.lineHeight.tight,\r\n letterSpacing: theme.letterSpacing.wider,\r\n color: theme.black,\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n font: {\r\n size: '32px',\r\n },\r\n padding: { bottom: theme.zeta },\r\n }),\r\n});\r\n\r\nconst BrandAndCategory = styled.p({\r\n margin: { top: theme.spacing(6), bottom: theme.spacing(2) },\r\n color: theme.middleGray,\r\n textTransform: 'uppercase',\r\n font: {\r\n size: theme.beta,\r\n weight: theme.fontWeight.normal,\r\n },\r\n ...media(mediaQuery.mediaMinLarge, {\r\n marginTop: theme.spacing(8),\r\n fontSize: theme.gamma,\r\n }),\r\n});\r\n\r\nconst StockStatus = styled.div({\r\n display: 'flex',\r\n alignItems: 'center',\r\n margin: { bottom: theme.spacing(8) },\r\n ...media(mediaQuery.mediaMinLarge, {\r\n marginBottom: theme.spacing(6),\r\n }),\r\n});\r\n\r\nconst StyledCheckIcon = styled(CheckIcon, {\r\n height: '18px',\r\n width: '18px',\r\n marginLeft: '8px',\r\n});\r\n\r\nconst ItemAddedText = styled.div({\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n color: theme.white,\r\n height: theme.gamma,\r\n margin: { xy: 'auto' },\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n right: 0,\r\n bottom: 0,\r\n});\r\n\r\nconst StockStatusCircle = styled.div({\r\n borderRadius: '50%',\r\n width: '8px',\r\n height: '8px',\r\n backgroundColor: theme.notInStockRed,\r\n marginRight: theme.spacing(2),\r\n ...pseudo([':nth-child(n)[data-instock=\"true\"]'], {\r\n backgroundColor: theme.inStockGreen,\r\n }),\r\n});\r\n\r\nconst StockStatusText = styled.span({\r\n color: theme.black,\r\n font: { size: theme.alpha, weight: theme.fontWeight.bold },\r\n textTransform: 'uppercase',\r\n});\r\n\r\nconst InformationListItem = styled.div({\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n alignItems: 'center',\r\n padding: { x: theme.spacing(4) },\r\n});\r\n\r\nconst ListItemTitle = styled.span({\r\n color: theme.middleGray,\r\n fontSize: theme.headerMainLink,\r\n textTransform: 'uppercase',\r\n});\r\n\r\nconst ListItem = styled.span({\r\n fontSize: theme.beta,\r\n color: theme.black,\r\n});\r\n\r\nconst StyledDivider = styled(Divider, {\r\n width: '100%',\r\n backgroundColor: theme.grayLine,\r\n margin: { y: theme.delta },\r\n ...media(theme.mediaQuery.mediaMaxMedium, {\r\n margin: { y: theme.delta },\r\n }),\r\n});\r\n\r\nconst PriceContainer = styled.div({\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n margin: {\r\n top: theme.theta,\r\n bottom: theme.psi,\r\n },\r\n});\r\n\r\nconst MainPriceContainer = styled.div({\r\n display: 'flex',\r\n alignItems: 'center',\r\n});\r\n\r\nconst QuantityPriceWrapper = styled.div({\r\n fontSize: '15px',\r\n display: 'flex',\r\n justifyContent: 'end',\r\n ...pseudo(':not(:last-child)', { marginBottom: theme.spacing(3) }),\r\n});\r\n\r\nconst Price = styled.span({\r\n font: {\r\n size: theme.nearGreat,\r\n weight: theme.fontWeight.bold,\r\n },\r\n marginTop: theme.spacing(2),\r\n lineHeight: theme.lineHeight.tight,\r\n letterSpacing: theme.letterSpacing.wider,\r\n color: theme.black,\r\n});\r\n\r\nconst PerPackageText = styled.p({\r\n marginTop: theme.spacing(4),\r\n fontSize: '17px',\r\n marginLeft: '6px',\r\n});\r\n\r\nconst QuantityText = styled.span({ color: theme.middleGray });\r\n\r\nconst QuantityTextBold = styled.span({\r\n fontWeight: theme.fontWeight.bold,\r\n color: theme.black,\r\n});\r\n\r\nconst AddToCart = styled.div({\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'space-between',\r\n});\r\n\r\nconst QuantitySelector = styled.div({\r\n backgroundColor: theme.white,\r\n borderRadius: '100px',\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n width: '35%',\r\n alignItems: 'center',\r\n padding: { x: theme.spacing(5), y: '14px' },\r\n ...media(mediaQuery.mediaMinLarge, {\r\n padding: { y: '18px' },\r\n }),\r\n});\r\n\r\nconst MinusButton = styled.button({\r\n ':disabled': {\r\n cursor: 'default',\r\n opacity: 0.6,\r\n },\r\n});\r\n\r\nconst QuantityInput = styled.input({\r\n width: theme.spacing(7),\r\n backgroundColor: theme.white,\r\n textAlign: 'center',\r\n MozAppearance: 'textfield', // hide number arrows Firefox\r\n ...pseudo(['::-webkit-outer-spin-button', '::-webkit-inner-spin-button'], {\r\n WebkitAppearance: 'none', // hide number arrows Chrome, Safari, Edge, Opera\r\n margin: { xy: 0 },\r\n }),\r\n});\r\n\r\nconst StyledPlusIcon = styled(PlusToggleIcon, {\r\n height: '20px',\r\n width: '20px',\r\n fill: theme.black,\r\n});\r\n\r\nconst StyledMinusIcon = styled(MinusToggleIcon, {\r\n height: '20px',\r\n width: '20px',\r\n fill: theme.black,\r\n});\r\n\r\nconst AddToCartButton = styled(CtaButton, {\r\n position: 'relative',\r\n width: '65%',\r\n fontSize: theme.moreLarge,\r\n textAlign: 'center',\r\n lineHeight: '1.3em',\r\n padding: { x: theme.spacing(5), y: '15px' },\r\n marginLeft: theme.spacing(5),\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n padding: { y: theme.spacing(5) },\r\n }),\r\n});\r\n\r\nconst ProductAttrListWrapper = styled.div({\r\n whiteSpace: 'pre-line',\r\n textAlign: 'center',\r\n});\r\n\r\nconst AttrContainerWrapper = styled.div({\r\n width: '100%',\r\n ...media(theme.mediaQuery.mediaMinSmall, {\r\n padding: { x: theme.none },\r\n }),\r\n});\r\n\r\nexport default AttributeArea;\r\n","import React, { useState } from 'react';\r\nimport { styled, theme } from '../Theme';\r\nimport ImageModel from '../Assets/Models/ImageModel.interface';\r\nimport useMedia from '../Shared/Hooks/useMedia';\r\nimport { useAppSettingsData } from '../Shared/AppSettingsProvider/AppSettingsProvider';\r\nimport { pseudo, media } from '@glitz/core';\r\nimport Modal from '../Shared/Modal/Modal';\r\nimport ModalImage from '../Shared/Modal/Content/Image';\r\nimport { StyleOrStyleArray } from '@glitz/type';\r\n\r\ntype ProductImages = {\r\n image: ImageModel;\r\n};\r\n\r\nfunction ProductImagesContainer({ image }: ProductImages) {\r\n const [showModal, toggleModal] = useState(false);\r\n\r\n const {\r\n translations: { 'productPage/close': closeLabel },\r\n } = useAppSettingsData();\r\n\r\n const isSmall = useMedia(theme.mediaQuery.mediaMaxSmall);\r\n\r\n return (\r\n \r\n {/* {!isSmall && images.length > 1 && (\r\n \r\n {images.map((image, index) => (\r\n setMainImage(image)}>\r\n \r\n \r\n ))}\r\n \r\n )}\r\n {showModal && (\r\n toggleModal(false)}\r\n closeLable={closeLabel}\r\n >\r\n \r\n \r\n )} */}\r\n toggleModal(true)}\r\n />\r\n \r\n );\r\n}\r\n\r\nconst Selected: StyleOrStyleArray = {\r\n border: {\r\n xy: {\r\n color: theme.black,\r\n },\r\n },\r\n};\r\n\r\nconst MainImageDiv = styled.div({\r\n position: 'relative',\r\n display: 'flex',\r\n padding: {\r\n xy: theme.gamma,\r\n },\r\n paddingBottom: 0,\r\n filter: theme.shadows.productImageShadow,\r\n margin: { x: `-${theme.gamma}` },\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n margin: { x: theme.none },\r\n }),\r\n});\r\n\r\nconst MainImage = styled.img({\r\n width: '100%',\r\n maxHeight: theme.productImageMaxHeight,\r\n objectFit: 'contain',\r\n ...pseudo(':hover', {\r\n cursor: 'pointer',\r\n }),\r\n ...media(theme.mediaQuery.mediaMinMedium, {\r\n maxHeight: theme.productImageMaxHeight,\r\n }),\r\n});\r\n\r\nconst ThumbnailContainer = styled.div({\r\n height: 'auto',\r\n width: 'auto',\r\n display: 'flex',\r\n flexDirection: 'column',\r\n marginLeft: '13px',\r\n});\r\n\r\nconst ThumbnailImage = styled.img({\r\n maxHeight: theme.thumbnailImageHeight,\r\n width: 'auto',\r\n transition: {\r\n property: 'all',\r\n duration: theme.timings.threeTenths,\r\n timingFunction: 'linear',\r\n },\r\n ':hover': {\r\n opacity: 0.6,\r\n },\r\n});\r\n\r\nconst Thumbnail = styled.button({\r\n backgroundColor: 'transparent',\r\n height: theme.thumbnailImageHeight,\r\n width: 'auto',\r\n maxWidth: theme.thumbnailImageHeight,\r\n});\r\n\r\nexport default ProductImagesContainer;\r\n","import React from 'react';\r\nimport IProductPage from './Models/ProductPageModel.interface';\r\nimport useCurrentPage from '../Shared/Hooks/useCurrentPage';\r\nimport { styled, theme } from '../Theme';\r\nimport ContentContainer from '../Shared/ContentContainer/ContentContainer';\r\nimport AttributeArea from '../ProductPage/AttributeArea';\r\nimport ProductImagesContainer from './ProductImagesContainer';\r\nimport { media } from '@glitz/core';\r\nimport Breadcrumb from '../Shared/Breadcrumb/Breadcrumb';\r\nimport KexLink from '../Shared/KexLink/KexLink';\r\nimport ArrowLeftIconPrimary from '../Shared/Icons/ArrowLeftIconPrimary';\r\nimport { useAppSettingsData } from '../Shared/AppSettingsProvider/AppSettingsProvider';\r\n\r\nfunction ProductPage() {\r\n const productPageData = useCurrentPage();\r\n const {\r\n translations: { 'productPage/backToPlanogram': backToPlanogramLabel },\r\n placeholderImages: { productPlaceholder: productPlaceholderImg },\r\n } = useAppSettingsData();\r\n const variation = productPageData.variationCollection[0];\r\n const {\r\n sliderImages,\r\n code,\r\n breadcrumb,\r\n planogramUrl,\r\n bookingNumber,\r\n inputQuantity,\r\n } = productPageData;\r\n\r\n return (\r\n
\r\n {!planogramUrl ? (\r\n !!breadcrumb.length && \r\n ) : (\r\n \r\n \r\n {backToPlanogramLabel}\r\n \r\n )}\r\n
\r\n \r\n \r\n {sliderImages && !!sliderImages.length ? (\r\n \r\n \r\n \r\n ) : (\r\n \r\n )}\r\n \r\n \r\n \r\n
\r\n
\r\n );\r\n}\r\n\r\nconst BackLinkWrapper = styled.div({\r\n position: 'absolute',\r\n top: theme.desktopHeaderHeight,\r\n left: 0,\r\n right: 0,\r\n margin: { x: 'auto' },\r\n maxWidth: theme.screenMaxWidth,\r\n width: '100%',\r\n paddingTop: '18px',\r\n alignItems: 'center',\r\n display: 'flex',\r\n paddingLeft: '32px',\r\n lineHeight: 1.33,\r\n letterSpacing: 0.45,\r\n});\r\n\r\nconst ArrowLeftIcon = styled(ArrowLeftIconPrimary, {\r\n fill: theme.linkColor,\r\n marginRight: theme.spacing(4),\r\n});\r\n\r\nconst BackLink = styled(KexLink, {\r\n fontSize: theme.gamma,\r\n color: theme.linkColor,\r\n cursor: 'pointer',\r\n textDecoration: 'underline',\r\n});\r\n\r\nconst Section = styled.section({\r\n backgroundColor: theme.primaryBackground,\r\n position: 'relative',\r\n maxWidth: '100%',\r\n margin: { top: theme.spacing(16), bottom: theme.spacing(16) },\r\n padding: { x: theme.large },\r\n ...media(theme.mediaQuery.mediaMinSmall, {\r\n padding: { x: theme.great },\r\n }),\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n margin: { top: theme.spacing(13), bottom: theme.spacing(32) },\r\n }),\r\n});\r\n\r\nconst Top = styled.div({\r\n display: 'grid',\r\n gridTemplateColumns: '1fr',\r\n gridGap: theme.none,\r\n width: '100%',\r\n ...media(theme.mediaQuery.mediaMinHuge, {\r\n gridTemplateColumns: '1fr 1fr',\r\n }),\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n gridTemplateColumns: '1fr 1fr',\r\n gridGap: theme.massive,\r\n }),\r\n});\r\n\r\nconst ProductImage = styled.div({\r\n maxWidth: '100%',\r\n ...media(theme.mediaQuery.mediaMinMedium, {\r\n gridColumn: {\r\n start: 1,\r\n end: 3,\r\n },\r\n }),\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n gridColumn: {\r\n start: 1,\r\n end: 1,\r\n },\r\n }),\r\n});\r\n\r\nconst ModalProductImage = styled.img({\r\n height: '100%',\r\n width: '100%',\r\n objectFit: 'contain',\r\n});\r\n\r\nexport default ProductPage;\r\n","import React from 'react';\r\nimport { styled, StyledProps } from '@glitz/react';\r\nimport { theme } from '../../Theme';\r\n\r\nfunction ArrowLeftIconPrimary({ compose }: StyledProps) {\r\n return (\r\n \r\n \r\n \r\n );\r\n}\r\n\r\nexport default styled(ArrowLeftIconPrimary);\r\n"],"sourceRoot":""}