{"version":3,"sources":["webpack:///./src/components/_pages/Genres/Genres.styled.js","webpack:///./src/components/_pages/Genres/Genres.js","webpack:///./src/redux/bikes/selectors.js","webpack:///./src/constants/bikes.js","webpack:///./src/assets/icons/arrow-down.svg","webpack:///./src/assets/icons/chevron-right.svg","webpack:///./src/hooks/usePrevious.js","webpack:///./src/helpers/routing.js","webpack:///./src/components/Tray/Tray.styled.js","webpack:///./src/components/_utility/Container.js","webpack:///./src/assets/icons/minus.svg","webpack:///./src/components/_utility/BackgroundImage/ResponsiveImage.js","webpack:///./src/components/_utility/Breadcrumb/Breadcrumb.js","webpack:///./src/assets/icons/reset.svg","webpack:///./src/assets/icons/filters.svg","webpack:///./src/components/BikeFilters/BikeFilters.styled.js","webpack:///./src/components/_form/RangeSlider/RangeSlider.styled.js","webpack:///./src/components/_form/RangeSlider/RangeSlider.js","webpack:///./src/components/BikeFilters/FilterDialog.styled.js","webpack:///./src/components/BikeFilters/FilterDialog.js","webpack:///./src/components/BikeFilters/FilterCard.js","webpack:///./src/components/BikeFilters/ActiveFilters.styled.js","webpack:///./src/components/BikeFilters/ActiveFilters.js","webpack:///./src/assets/icons/grid-view.svg","webpack:///./src/assets/icons/list-view.svg","webpack:///./src/helpers/analytics.js","webpack:///./src/components/BikeFilters/ViewAndSort.styled.js","webpack:///./src/components/BikeFilters/ViewAndSort.js","webpack:///./src/components/BikeFilters/BikeFilters.js","webpack:///./src/components/NotificationStrip/NotificationStrip.styled.js","webpack:///./src/components/NotificationStrip/NotificationStrip.js","webpack:///./src/components/Hero/Hero.styled.js","webpack:///./src/components/_utility/BackgroundImage/BackgroundImage.styled.js","webpack:///./src/components/_utility/BackgroundImage/BackgroundImage.js","webpack:///./src/components/Hero/Hero.js","webpack:///./src/components/_utility/NoResults/NoResults.styled.js","webpack:///./src/components/_utility/NoResults/NewResults.js","webpack:///./src/components/_cards/BikeCard/BikeCard.styled.js","webpack:///./src/components/_cards/BikeCard/BikeCard.js","webpack:///./src/components/FeatureBlock/FeatureBlock.styled.js","webpack:///./src/components/FeatureBlock/FeatureBlock.js"],"names":["Wrap","styled","div","NoResultsWrap","minBp","Genres","dispatch","useDispatch","useState","loading","setLoading","genres","useSelector","genreSelector","hero","heroSelector","count","getFeatureCardCount","useEffect","a","genrePromises","map","genre","Promise","resolve","request","id","res","cards","data","bikes","all","genresWithCards","setFeatureCards","features","type","setError","fetchFamiliesOrBikes","Loader","Hero","buttons","label","to","title","image","viewHidden","fluid","hasFilters","isGenrePage","key","description","ctaColour","ctacolour","Breadcrumb","activeFilterSelector","createSelector","state","activeFilterId","getBikeFilter","filterKey","filters","bikeFilter","getFilters","isFilterSet","filterIndex","filter","min","from","max","choice","Boolean","areFiltersSet","Object","values","some","getFiltersOpen","filtersOpen","getBikesView","view","getFilterChoices","reduce","prevFilterChoices","getPriceFilter","app","bikeFilters","priceFilter","find","priceFilterIndex","indexOf","filterBikes","filterChoices","bike","length","tags","every","tag","includes","filterBikesByPrice","price","bikesSelector","results","page","sort","selectedSortOption","sortOptions","sortOption","filteredResults","sortFunction","resultsVisible","slice","filteredCount","getFeatureCards","entries","prevFeatures","featureId","filteredFeatures","prevCount","getBikesSort","styles","props","xmlns","width","height","viewBox","d","fill","usePrevious","value","ref","useRef","current","useNavigate","basepath","basepathSelector","substr","args","_navigate","Container","section","theme","hideOnDesktop","isScrolling","heights","tray","mobile","tablet","desktop","BoxShadow","PrevNextStyles","css","nextBtn","isLastStep","financeHidden","PrevNextButton","Button","buttonStyles","PrevNextLinkA","LinkButton","PrevNextText","span","isMac","ConfigOptionsContainer","trayModalOpen","ConfigOptionsCloseButton","button","FinanceOptionsContainer","ConfigOptionsStyles","ConfigOptions","disabled","ConfigOptionsLink","ConfigOptionsLinkA","ConfigOptionsHeader","ConfigOptionsTitle","fonts","dinDemi","ConfigOptionsLabelWrapper","dinRegular","ConfigOptionsModalButton","hidden","ConfigOptionsBackButton","ConfigOptionsBackButtonWrapper","InfoButton","FinanceOptionWrap","monthlyBreakdown","PriceOptionsLabelWrapper","Icon","img","Price","PriceWrapper","GarageCount","FinanceButton","FinanceLabel","ResponsiveImage","mobileLarge","tabletLarge","alt","window","objectFitPolyfill","picturefill","media","breakpoints","srcSet","encodeURI","mobileEnd","src","data-object-fit","A","OL","ol","maxBp","additionalLinks","hybridBreadcrumb","breadcrumbSelector","concat","breadcrumbEl","document","querySelector","activeFilter","createElement","classList","add","body","appendChild","style","display","getViewportWidth","createPortal","vocab","typeof","onClick","setActiveFilter","link","index","isCurrentPage","linkProps","LinkEl","Fragment","siteLink","property","href","url","Link","text","dangerouslySetInnerHTML","__html","home","aria-hidden","className","content","ActiveFiltersOuter","hideOnMobile","visible","filterOpen","FilterCards","Card","active","CardIcon","CardWrap","TitleBar","CloseButton","ApplyButtonWrapper","ApplyButton","ResultsBar","ResultsCount","ResetButton","ChevronRightIcon","_ChevronRightIcon","RefineResults","RefineResultsInner","FilterButton","FiltersBody","Outer","Circle","HandleWrap","left","Handle","Tooltip","RangeSlider","onDecreaseQuantity","onIncreaseQuantity","canDecrease","canIncrease","data-testid","marks","20","40","100","step","handle","handleProps","offset","role","aria-valuemin","aria-valuemax","aria-valuenow","tabindex","Label","name","Dialog","hasButton","DialogHeader","FilterTitle","h3","Description","RangeDescription","ClickCatch","BackButton","OptionsWrap","DescriptionWrap","DialogBody","FilterIcon","ResetFilterButton","ScrollIndicator","Range","pushToDataLayer","useDataLayer","bikeFilterFrom","bikeFilterTo","floor","ceiling","fromValue","parseInt","toValue","fromText","toText","fromIndex","toIndex","prevMarks","factory","val","toLowerCase","onChange","configuratorFilter","setFilterRange","Choice","Radio","checked","setFilterChoice","isWhite","option","FilterDialog","icon","scrollIndicatorVisible","setScrollIndicatorVisible","filtersSelector","filterSet","dialogBodyRef","FilterBody","slider","options","dialogBodyEl","setTimeout","scrollTop","isIOS","scrollHeight","getBoundingClientRect","addEventListener","el","getImageBaseUrl","resetFilter","FilterCard","onSelectCard","children","thin","Option","Close","RangeLabel","ChoiceLabel","choiceId","ActiveFilters","filtersState","activeFilters","filterState","sendGaEvent","action","ga","ViewWrap","LabelWrap","IconWrap","SelectWrap","Select","select","ViewAndSort","bikeView","sortValue","getLabel","useLabel","setToGrid","setView","removeEventListener","tabIndex","event","setSort","target","BikeFilters","isFamilyPage","openFilterIndex","filtersSet","bikeCardCount","featureCardCount","previousFiltersOpen","handleSelectCard","filterId","bodyNoScroll","remove","closeFiltersOnOrientationChange","closeFiltersModal","clearFilters","applyFilters","openFiltersModal","Message","CTA","primary","NotificationStrip","NotificationStripPortal","userEmail","localStorage","getItem","configurations","getConfigurations","notificationStripEl","parentNode","insertBefore","setConfigurations","fetchConfigurations","ContentWrap","Title","h2","ButtonWrapper","HeroButtonStyle","whiteBackground","colors","white","HeroButton","HeroLinkButton","HeroImageWrapper","BackgroundImageContainer","BackgroundImageWrapper","BackgroundImage","srcSmall","srcMedium","srcLarge","noMargin","p","NoResults","_Link","isListingsPage","listView","ImageWrap","Image","Content","Name","h4","RichText","Actions","Divider","Action","ActionLink","MainContent","AdditionalContent","DetailedDescription","BikeCard","thumbnail","priceLocalised","pricePrefixText","detailDescription","family","About","Hairline","Bikes","BikeScroller","cardCount","Gutter","_BikeCard","ViewButton","variant","racingYellow","racingYellowDark","FeatureBlock","scrollerRef","familyCards","navigate","buttonRef","noDefaultStyles","renderer","_scrollerRef","elementRef","onUpdate","contains","bottom","card"],"mappings":"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","file":"b1f540216edcfe9c654d.js","sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { minBp } from 'src/lib/theme';\n\nexport const Wrap = styled.div`\n  padding-bottom: 40px;\n`;\n\nexport const NoResultsWrap = styled.div`\n  margin: 0 30px;\n\n  @media ${minBp('tabletLarge')} {\n    margin: 0 100px;\n  }\n`;\n","import React, { useEffect, useState } from 'react';\nimport { useSelector, useDispatch } from 'react-redux';\nimport { genreSelector, heroSelector } from 'src/redux/app/selectors';\nimport Genre from 'components/FeatureBlock/FeatureBlock';\nimport Hero from 'components/Hero/Hero';\nimport Breadcrumb from 'components/_utility/Breadcrumb/Breadcrumb';\nimport NoResults from 'components/_utility/NoResults/NewResults';\nimport Loader from 'components/_utility/Loader/Loader';\nimport request from 'helpers/request';\nimport { setFeatureCards } from 'src/redux/bikes/actions';\nimport { setError } from 'src/redux/app/actions';\nimport { getFeatureCardCount } from 'src/redux/bikes/selectors';\nimport { Wrap, NoResultsWrap } from './Genres.styled';\n\nconst Genres = () => {\n  const dispatch = useDispatch();\n  const [loading, setLoading] = useState(true);\n  const genres = useSelector(genreSelector);\n  const hero = useSelector(heroSelector);\n  const count = useSelector(getFeatureCardCount('genre'));\n\n  useEffect(() => {\n    const fetchFamiliesOrBikes = async () => {\n      try {\n        const genrePromises = genres.map(\n          async genre =>\n            new Promise(async resolve => {\n              const res = await request(`/api/configurator/bikes/families?genre=${genre.id}`);\n\n              resolve({ id: genre.id, cards: res.data.bikes });\n            })\n        );\n        const genresWithCards = await Promise.all(genrePromises);\n\n        dispatch(setFeatureCards({ features: genresWithCards, type: 'genre' }));\n        setLoading(false);\n      } catch (ex) {\n        dispatch(setError(ex));\n      }\n    };\n\n    fetchFamiliesOrBikes();\n  }, []);\n\n  if (loading) {\n    return <Loader />;\n  }\n\n  return (\n    <>\n      <Hero\n        buttons={[{ id: 'viewall', label: 'viewAllButton', to: '/bikes' }]}\n        title={hero.title}\n        image={hero.image}\n        viewHidden\n        fluid\n        hasFilters\n        isGenrePage\n      />\n      <Wrap>\n        {count ? (\n          genres.map(genre => (\n            <Genre\n              key={genre.id}\n              id={genre.id}\n              title={genre.title}\n              description={genre.description}\n              ctaColour={genre.ctacolour}\n            />\n          ))\n        ) : (\n          <NoResultsWrap>\n            <NoResults />\n          </NoResultsWrap>\n        )}\n      </Wrap>\n      <Breadcrumb />\n    </>\n  );\n};\n\nexport default Genres;\n","import { createSelector } from 'reselect';\nimport { BIKES_PER_PAGE } from 'src/constants/bikes';\nimport sortOptions from 'src/config/sortOptions.config';\n\nexport const activeFilterSelector = createSelector(\n  state => state.bikes.activeFilterId,\n  activeFilterId => activeFilterId\n);\n\nexport const getBikeFilter = filterKey =>\n  createSelector(\n    state => state.bikes.filters[filterKey],\n    bikeFilter => bikeFilter\n  );\n\nexport const getBikeFilterFrom = filterKey =>\n  createSelector(\n    state => state.bikes.filters[filterKey].from,\n    from => from\n  );\n\nexport const getBikeFilterTo = filterKey =>\n  createSelector(\n    state => state.bikes.filters[filterKey].to,\n    to => to\n  );\n\nexport const getFilters = createSelector(\n  state => state.bikes.filters,\n  filters => filters\n);\n\nexport const isFilterSet = filterIndex =>\n  createSelector(\n    state => state.bikes.filters[filterIndex],\n    filter => {\n      if (filter.min) {\n        return filter.min !== filter.from || filter.max !== filter.to;\n      }\n\n      if (filter.choice) {\n        return Boolean(filter.choice);\n      }\n\n      return false;\n    }\n  );\n\nexport const areFiltersSet = createSelector(\n  state => state.bikes.filters,\n  filters =>\n    Object.values(filters).some(filter => {\n      if (typeof filter.min !== 'undefined') {\n        return filter.min !== filter.from || filter.max !== filter.to;\n      }\n\n      if (typeof filter.choice !== 'undefined') {\n        return Boolean(filter.choice);\n      }\n\n      return false;\n    })\n);\n\nexport const getFiltersOpen = createSelector(\n  state => state.bikes.filtersOpen,\n  filtersOpen => filtersOpen\n);\n\nexport const getBikesView = createSelector(\n  state => state.bikes.view,\n  view => view\n);\n\nexport const getFilterChoices = createSelector(\n  state => state.bikes.filters,\n  filters =>\n    Object.values(filters).reduce((prevFilterChoices, filter) => {\n      if (!filter.choice) {\n        return prevFilterChoices;\n      }\n\n      return [...prevFilterChoices, filter.choice];\n    }, [])\n);\n\nexport const getPriceFilter = createSelector(\n  state => state.app.data.filters,\n  state => state.bikes.filters,\n  (filters, bikeFilters) => {\n    const priceFilter = filters.find(filter => filter.type === 'slider');\n\n    if (!priceFilter) {\n      return null;\n    }\n\n    const priceFilterIndex = filters.indexOf(priceFilter);\n\n    return {\n      ...priceFilter,\n      ...bikeFilters[priceFilterIndex],\n    };\n  }\n);\n\nconst filterBikes = filterChoices => bike => {\n  if (!filterChoices.length) {\n    return true;\n  }\n\n  return bike.tags && filterChoices.every(tag => bike.tags.includes(tag));\n};\n\nconst filterBikesByPrice = filter => bike =>\n  !filter || (bike.price >= filter.from && bike.price <= filter.to) || !bike.price;\n\nexport const bikesSelector = createSelector(\n  state => state.bikes.results,\n  state => state.bikes.page,\n  state => state.bikes.sort,\n  getFilterChoices,\n  getPriceFilter,\n  (bikes, page, sort, filterChoices, priceFilter) => {\n    const selectedSortOption = sortOptions.find(sortOption => sortOption.id === sort);\n\n    const filteredResults = bikes\n      .filter(filterBikes(filterChoices))\n      .filter(filterBikesByPrice(priceFilter))\n      .sort(selectedSortOption ? selectedSortOption.sortFunction : () => 0);\n\n    const resultsVisible = filteredResults.slice(0, page * BIKES_PER_PAGE);\n\n    return {\n      count: bikes.length,\n      filteredCount: filteredResults.length,\n      results: resultsVisible,\n    };\n  }\n);\n\nexport const getFeatureCards = type =>\n  createSelector(\n    state => state.bikes[type === 'genre' ? 'genreCards' : 'familyCards'],\n    state => state.bikes.sort,\n    getFilterChoices,\n    getPriceFilter,\n    (features, sort, filterChoices, priceFilter) => {\n      const selectedSortOption = sortOptions.find(sortOption => sortOption.id === sort);\n\n      return Object.entries(features).reduce(\n        (prevFeatures, [featureId, cards]) => ({\n          ...prevFeatures,\n          [featureId]: cards\n            .filter(filterBikes(filterChoices))\n            .filter(filterBikesByPrice(priceFilter))\n            .sort(selectedSortOption ? selectedSortOption.sortFunction : () => 0),\n        }),\n        {}\n      );\n    }\n  );\n\nexport const getFeatureCardCount = type =>\n  createSelector(getFeatureCards(type), filteredFeatures => {\n    if (!Object.entries(filteredFeatures).length) {\n      return null;\n    }\n\n    return Object.entries(filteredFeatures).reduce((prevCount, [featureId, cards]) => prevCount + cards.length, 0);\n  });\n\nexport const getBikesSort = createSelector(\n  state => state.bikes.sort,\n  sort => sort\n);\n","export const BIKES_PER_PAGE = 8;\n","import React from \"react\";\nexport default (({\n  styles = {},\n  ...props\n}) => <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" {...props}><path d=\"M15 4h2v20.063l6.781-6.781 1.438 1.438-8.5 8.5-.719.688-.719-.688-8.5-8.5 1.438-1.438L15 24.063V4z\" /></svg>);","import React from \"react\";\nexport default (({\n  styles = {},\n  ...props\n}) => <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"19\" height=\"19\" viewBox=\"0 0 32 32\" {...props}><path d=\"M12.969 4.281l11 11 .688.719-.688.719-11 11-1.438-1.438L21.812 16 11.531 5.719z\" fill=\"#fff\" /></svg>);","import React, { useRef, useEffect } from 'react';\n\nconst usePrevious = value => {\n  const ref = useRef();\n\n  useEffect(() => {\n    ref.current = value;\n  }, [value]);\n\n  return ref.current;\n};\n\nexport default usePrevious;\n","import React from 'react';\nimport { useSelector } from 'react-redux';\nimport { navigate as _navigate } from '@reach/router';\nimport { basepathSelector } from 'src/redux/app/selectors';\n\nexport const useNavigate = () => {\n  let basepath = useSelector(basepathSelector);\n\n  if (basepath[basepath.length - 1] === '/') {\n    basepath = basepath.substr(0, basepath.length - 1);\n  }\n\n  return (to, ...args) => _navigate(basepath + to, ...args);\n};\n","import React from 'react';\nimport styled, { css } from 'styled-components';\nimport Button, { buttonStyles, LinkButton } from 'components/Button/Button';\n\nimport { minBp } from '../../lib/theme';\n\nexport const Container = styled.section`\n  ${({ theme, hideOnDesktop, isScrolling }) => `\n    display: flex;\n    align-items: center;\n    height: ${theme.heights.tray.mobile}px;\n    z-index: 102;\n    width: 100%;\n    position: fixed;\n    bottom: 0;\n    transition: height 0.3s ease;\n    height: ${isScrolling ? '34px' : '70px'};\n    \n\n    @media ${minBp('tablet')} {\n      transition: unset;\n      height: ${theme.heights.tray.tablet}px;\n    }\n\n    @media ${minBp('tabletLarge')} {\n      height: ${theme.heights.tray.desktop}px;\n      display: ${hideOnDesktop ? 'none' : 'flex'};\n    }\n  `}\n`;\n\nexport const BoxShadow = styled.div`\n  height: 20px;\n  top: -20px;\n  position: absolute;\n  width: 100%;\n  background: linear-gradient(-180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.15) 100%);\n  pointer-events: none;\n\n  @media ${minBp('desktop')} {\n    height: 30px;\n    top: -30px;\n  }\n`;\n\nexport const PrevNextStyles = css`\n  ${({ nextBtn, isLastStep, financeHidden }) => `\n    background: ${nextBtn ? '#cd192d' : '#a7a9ac'};\n    color: ${nextBtn ? '#fff' : '#000'};\n    height: 100%;\n    align-items: center;\n    justify-content: center;\n    flex-grow: 1;\n    cursor: pointer;\n    margin: 0;\n    flex-basis: 0;\n    line-height: 1.15;\n    padding: 2px 22px 0;\n    text-align: left;\n    min-width: ${isLastStep ? '50%' : '140px'};\n    // min-width: ${isLastStep || financeHidden ? '120px' : '60px'};\n    // max-width: ${isLastStep || financeHidden ? '120px' : '60px'};\n\n    @media ${minBp('additional.mobile')} {\n      min-width: ${isLastStep ? '50%' : '160px'};\n    }\n\n    @media ${minBp('tablet')} {\n      max-width: none;\n    }\n\n    &:hover,\n    &:focus {\n      background: ${nextBtn ? '#8F111F' : '#8E9093'}\n    }\n\n    &:disabled {\n      background: #a7a9ac;\n      cursor: not-allowed;\n      opacity: 1;\n    }\n\n    ${!nextBtn && 'display: none'}\n\n    @media ${minBp('desktop')} {\n      padding: 2px 30px 0;\n      text-align: center;\n      ${!nextBtn && 'display: flex'};\n    }\n  `}\n`;\n\nexport const PrevNextButton = styled(Button)`\n  ${buttonStyles}\n  ${PrevNextStyles}\n`;\n\nexport const PrevNextLink = styled(LinkButton)`\n  ${buttonStyles}\n  ${PrevNextStyles}\n  display: flex;\n  background: #cd192d;\n  color: #fff;\n\n  &:hover,\n  &:focus {\n    background: #8f111f;\n  }\n\n  svg {\n    margin-left: 5px;\n    width: 15px;\n    min-width: 15px;\n\n    @media ${minBp('tablet')} {\n      margin-left: 0;\n      width: 16px;\n    }\n  }\n`;\n\nexport const PrevNextLinkA = styled.a`\n  ${buttonStyles}\n  ${PrevNextStyles}\n  display: flex;\n  background: #cd192d;\n  color: #fff;\n\n  @media ${minBp('additional.mobile')} {\n    padding: 2px 30px 0;\n  }\n\n  &:hover,\n  &:focus {\n    background: #8f111f;\n  }\n\n  svg {\n    margin-left: 5px;\n    width: 15px;\n    min-width: 15px;\n\n    @media ${minBp('tablet')} {\n      margin-left: 0;\n      width: 16px;\n    }\n  }\n`;\n\nexport const PrevNextText = styled.span`\n  ${({ nextBtn, isMac, isLastStep, financeHidden }) => `\n    display: flex;\n    align-items: center;\n\n    @media ${minBp('desktop')} {\n      margin: 0 8px;\n    }\n\n    span {\n      display: inline-block;\n      // display: ${isLastStep || financeHidden ? 'inline-block' : 'none'};\n      margin-right: ${isLastStep || financeHidden ? '8px' : 0};\n\n      @media ${minBp('tablet')} {\n        display: inline;\n        margin: 0;\n      } \n    }\n\n    svg {\n      position: relative;\n      top: auto;\n      bottom: ${isMac ? '1px' : '2px'};\n      width: 10px;\n      height: 10px;\n      vertical-align: middle;\n\n      @media ${minBp('tablet')} {\n        margin-right: ${nextBtn ? '0' : '5px'};\n        margin-left: ${nextBtn ? '5px' : '0px'};\n      }\n\n      @media ${minBp('desktop')} { \n        top: auto;\n        bottom: ${isMac ? '1px' : '2px'};\n      }\n    }\n`}\n`;\n\nexport const ConfigOptionsContainer = styled.div`\n  ${({ trayModalOpen }) => `\n    display: ${trayModalOpen ? 'flex' : 'none'};\n    flex-direction: column;\n    position: fixed;\n    top: 0;\n    background: #fff;\n    width: 100%;\n    z-index: 11;\n    height: 100%;\n\n    @media ${minBp('desktop')} {\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      position: relative;\n      top: auto;\n      flex-grow: 2;\n      height: 100%;\n      width: auto;\n      z-index: 2;\n    }\n  `}\n`;\n\nexport const ConfigOptionsCloseButton = styled.button`\n  background: transparent;\n  border: none;\n  padding: 10px;\n  position: absolute;\n  top: 12px;\n  right: 18px;\n`;\n\nexport const FinanceOptionsContainer = styled.div`\n  ${({ theme, financeHidden }) => `\n    display: flex;\n    flex-grow: 1;\n    height: 100%;\n    align-items: center;\n    background-color: #000;\n    color: #fff;\n\n    @media ${minBp('tablet')} {\n      flex-grow: 0.5;\n      min-width: ${financeHidden ? '225px' : '450px'};\n    }\n  `}\n`;\n\nexport const ConfigOptionsStyles = css`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  background: #fff;\n  font-size: 14px;\n  text-decoration: none;\n  color: #585a5f;\n  height: 50px;\n  margin: 0 30px;\n  cursor: pointer;\n  border-top: 1px solid transparent;\n  border-bottom: 1px solid #e0e0e0;\n  border-left: 1px solid transparent;\n  border-right: none;\n  position: relative;\n  padding: 0;\n\n  @media ${minBp('desktop')} {\n    border-right: 1px solid #e0e0e0;\n    flex: 1;\n    margin: 0;\n  }\n\n  svg {\n    position: absolute;\n    right: 30px;\n\n    @media ${minBp('desktop')} {\n      position: static;\n    }\n\n    path {\n      fill: #000;\n    }\n  }\n\n  @media ${minBp('desktop')} {\n    flex-direction: column;\n    height: 100%;\n    flex-grow: 1;\n    justify-content: center;\n\n    svg {\n      display: none;\n    }\n  }\n`;\n\nexport const ConfigOptions = styled.button`\n  ${ConfigOptionsStyles}\n\n  ${({ disabled }) =>\n    disabled\n      ? `\n    opacity: 0.5;\n    pointer-events: none;\n    cursor: default;\n  `\n      : ``}\n`;\n\nexport const ConfigOptionsLink = styled(LinkButton)`\n  ${ConfigOptionsStyles}\n\n  text-transform: none;\n  justify-content: flex-start;\n\n  :focus-visible {\n    outline: auto 1px Highlight;\n    outline: auto 1px -webkit-focus-ring-color;\n    outline-offset: 0;\n  }\n\n  @media ${minBp('desktop')} {\n    padding: 0;\n  }\n`;\n\nexport const ConfigOptionsLinkA = styled.a`\n  ${ConfigOptionsStyles}\n\n  text-transform: none;\n  justify-content: flex-start;\n\n  :focus-visible {\n    outline: auto 1px Highlight;\n    outline: auto 1px -webkit-focus-ring-color;\n    outline-offset: 0;\n  }\n\n  @media ${minBp('desktop')} {\n    padding: 0px;\n  }\n`;\n\nexport const ConfigOptionsHeader = styled.div`\n  background-color: #a7a9ac;\n  padding: 21px 30px 17px;\n  margin-bottom: 33px;\n\n  @media ${minBp('desktop')} {\n    display: none;\n  }\n`;\n\nexport const ConfigOptionsTitle = styled.span`\n  margin: 0;\n  font-family: ${({ theme }) => theme.fonts.dinDemi};\n  font-size: 17px;\n  font-weight: 500;\n  text-transform: uppercase;\n  line-height: 22px;\n  color: #000;\n`;\n\nexport const ConfigOptionsLabelWrapper = styled.span`\n  font-family: ${({ theme }) => theme.fonts.dinRegular};\n  display: block;\n  margin-left: 20px;\n  font-size: 16px;\n\n  @media ${minBp('desktop')} {\n    margin-left: 0;\n  }\n`;\n\nexport const ConfigOptionsModalButton = styled.button`\n  background: #a7a9ac;\n  height: 100%;\n  flex-grow: 1;\n  display: ${({ hidden }) => (hidden ? 'none' : 'flex')};\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  font-size: 14px;\n  text-decoration: none;\n  color: #585a5f;\n  border: none;\n  max-width: 40px;\n  margin: 0;\n\n  @media ${minBp('additional.mobile')} {\n    max-width: 60px;\n  }\n\n  @media ${minBp('tablet')} {\n    flex-grow: 0.4;\n    max-width: 150px;\n  }\n\n  @media ${minBp('desktop')} {\n    display: none;\n    flex-grow: 1;\n  }\n`;\n\nexport const ConfigOptionsBackButton = styled.button`\n  ${buttonStyles}\n  ${PrevNextStyles}\n\n  max-width: none;\n  display: block;\n  background: #cd192d;\n  height: 60px;\n  color: #fff;\n  width: 100%;\n\n  &:hover,\n  &:focus {\n    background: #8f111f;\n  }\n\n  @media ${minBp('desktop')} {\n    display: none;\n  }\n`;\n\nexport const ConfigOptionsBackButtonWrapper = styled.div`\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n\n  ${ConfigOptionsBackButton} {\n    text-align: center;\n  }\n`;\n\nexport const InfoButton = styled.button`\n  margin-right: 12px;\n  padding: 0;\n  background: transparent;\n  border: none;\n  cursor: pointer;\n\n  svg {\n    pointer-events: none;\n    vertical-align: middle;\n    width: 20px;\n    height: 20px;\n  }\n\n  @media ${minBp('tablet')} {\n    margin-right: 14px;\n  }\n\n  @media ${minBp('tabletLarge')} {\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n`;\n\nexport const FinanceOptionWrap = styled.div`\n  ${({ monthlyBreakdown, financeHidden }) => `\n    // display: ${monthlyBreakdown ? 'none' : 'flex'};\n    // align-items: center;\n    font-size: 14px;\n    height: 100%;\n    text-decoration: none;\n    color: #fff;\n    flex: 1;\n    // padding: 0 8px 0 16px;\n    appearance: none;\n    text-align: left;\n    border: 0;\n    background: transparent;\n\n    &:not(:last-child) {\n      border-right: 1px solid #4c4c4c;\n    }\n\n    @media ${minBp('tablet')} {\n      // display: flex;\n      // flex-direction: row;\n      // justify-content: flex-start;\n      // align-items: center;\n      // padding: 0 16px 0 32px;\n    }\n\n    @media ${minBp('tabletLarge')} {\n      // padding-left: 16px;\n      // max-width: ${financeHidden ? '100%' : '50%'};\n      max-width: 100%;\n      // justify-content: center;\n    }\n  `}\n`;\n\nexport const PriceOptionsLabelWrapper = styled(ConfigOptionsLabelWrapper)`\n  font-size: 12px;\n  margin: 0;\n\n  @media ${minBp('tabletLarge')} {\n    font-size: 14px;\n  }\n`;\n\nexport const FinanceOptionsLabelWrapper = styled(ConfigOptionsLabelWrapper)`\n  font-size: 12px;\n  margin: 0;\n\n  svg {\n    width: 8px;\n    height: 7px;\n    display: inline-block;\n    vertical-align: middle;\n    position: absolute;\n    right: 0;\n    top: 3px;\n    margin: 0;\n\n    path {\n      fill: white;\n    }\n  }\n\n  @media ${minBp('tabletLarge')} {\n    font-size: 14px;\n  }\n`;\n\nexport const Icon = styled.img`\n  height: 32px;\n  width: 32px;\n`;\n\nexport const Price = styled.span`\n  color: #fff;\n  font-size: 15px;\n  font-family: ${({ theme }) => theme.fonts.dinDemi};\n  margin-top: 2px;\n  line-height: 1;\n\n  @media ${minBp('tablet')} {\n    font-size: 17px;\n    display: flex;\n    align-items: center;\n    font-family: ${({ theme }) => theme.fonts.dinRegular};\n  }\n\n  @media ${minBp('desktop')} {\n    font-size: 22px;\n  }\n`;\n\nexport const PriceWrapper = styled.div`\n  ${({ theme }) => `\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    height: 100%;\n    position: relative;\n    margin: 0 auto;\n    padding: 0 10px;\n  `}\n`;\n\nexport const FinanceWrapper = styled.div`\n  ${({ theme }) => `  \n    display: flex;\n    align-items: center;\n    position: relative;\n\n    & > svg {\n      width: 18px;\n      height: 23px;\n      margin-right: 8px;\n\n      path {\n        fill: white;\n      }\n    }\n\n    @media ${minBp('tablet')} {\n      & > svg {\n        margin-right: 15px;\n      }\n    }\n  `}\n`;\n\nexport const GarageCount = styled.div`\n  left: 25px;\n  top: 4px;\n  font-size: 12px;\n  width: 20px;\n  height: 20px;\n  line-height: 20px;\n  background: red;\n  color: white;\n  position: absolute;\n  border-radius: 50%;\n  padding: 0;\n\n  @media ${minBp('desktop')} {\n    top: 5px;\n    left: 50%;\n    width: 25px;\n    height: 25px;\n    line-height: 25px;\n    font-size: inherit;\n  }\n`;\n\nexport const FinanceButton = styled.button`\n  font-family: inherit;\n  font-size: inherit;\n  color: white;\n  padding: 0;\n  background: transparent;\n  border: 0;\n  text-align: left;\n  display: flex;\n  flex-direction: column;\n`;\n\nexport const FinanceLabel = styled.span`\n  text-decoration: underline;\n  font-size: 12px;\n  color: white;\n  margin-top: 2px;\n`;\n","import React from 'react';\nimport styled from 'styled-components';\n\nconst Container = styled.div`\n  max-width: 1180px;\n  margin: 0 auto;\n  position: relative;\n`;\n\nexport default Container;\n","import React from \"react\";\nexport default (({\n  styles = {},\n  ...props\n}) => <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" {...props}><path d=\"M5 15h22v2H5v-2z\" /></svg>);","import React, { useEffect } from 'react';\n// TODO: Null checks and tests\n\nimport theme from 'src/lib/theme';\nimport 'objectFitPolyfill';\nimport 'picturefill';\n\nconst ResponsiveImage = ({ mobile, mobileLarge, tablet, tabletLarge, desktop, alt }) => {\n  useEffect(() => {\n    window.objectFitPolyfill();\n    window.picturefill();\n  }, []);\n\n  return (\n    <picture>\n      {desktop ? (\n        <source media={`(min-width: ${theme.breakpoints.desktop}px)`} srcSet={window.encodeURI(desktop)} />\n      ) : null}\n      {tabletLarge ? (\n        <source media={`(min-width: ${theme.breakpoints.tabletLarge}px)`} srcSet={window.encodeURI(tabletLarge)} />\n      ) : null}\n      {tablet ? (\n        <source media={`(min-width: ${theme.breakpoints.tablet}px)`} srcSet={window.encodeURI(tablet)} />\n      ) : null}\n      {mobileLarge ? (\n        <source media={`(min-width: ${theme.breakpoints.mobileEnd}px)`} srcSet={window.encodeURI(mobileLarge)} />\n      ) : null}\n      <img\n        srcSet={window.encodeURI(mobile || mobileLarge || tablet || tabletLarge || desktop)}\n        src={window.encodeURI(mobile || mobileLarge || tablet || tabletLarge || desktop)}\n        alt={alt}\n        data-object-fit\n        loading=\"lazy\"\n      />\n    </picture>\n  );\n};\n\nexport default ResponsiveImage;\n","import React, { Fragment, useEffect } from 'react';\nimport styled from 'styled-components';\nimport { createPortal } from 'react-dom';\nimport { useSelector, useDispatch } from 'react-redux';\nimport { breadcrumbSelector } from 'src/redux/app/selectors';\nimport { activeFilterSelector, getFiltersOpen } from 'src/redux/bikes/selectors';\nimport theme, { maxBp } from 'src/lib/theme';\nimport { setActiveFilter } from 'src/redux/bikes/actions';\nimport { getViewportWidth } from 'helpers/utilities';\nimport Link from '../Link/Link';\n\nconst A = styled.a``;\n\nconst OL = styled.ol`\n  @media ${maxBp('tabletLarge')} {\n    li {\n      display: none !important;\n    }\n\n    li:nth-child(-n + 2) {\n      display: inline-block !important;\n    }\n\n    li:nth-child(2) {\n      i {\n        display: none;\n      }\n    }\n  }\n`;\n\nconst Breadcrumb = ({ additionalLinks = [] }) => {\n  const breadcrumb = useSelector(breadcrumbSelector);\n  const hybridBreadcrumb = (breadcrumb || []).concat(additionalLinks);\n  let breadcrumbEl = document.querySelector('.breadcrumb');\n  const activeFilter = useSelector(activeFilterSelector);\n  const dispatch = useDispatch();\n  const filtersOpen = useSelector(getFiltersOpen);\n\n  if (!breadcrumbEl) {\n    breadcrumbEl = document.createElement('div');\n    breadcrumbEl.classList.add('breadcrumb');\n    document.body.appendChild(breadcrumbEl);\n  }\n\n  breadcrumbEl.style.display = 'block';\n  breadcrumbEl.classList.add('configurator');\n\n  if (filtersOpen && getViewportWidth() <= theme.breakpoints.tablet) {\n    breadcrumbEl.style.display = 'none';\n  }\n\n  const handleBreadcrumbClick = () => {\n    if (typeof activeFilter === 'number') {\n      dispatch(setActiveFilter(null));\n    }\n  };\n\n  return (\n    <>\n      {createPortal(\n        <OL vocab=\"http://schema.org/\" typeof=\"BreadcrumbList\" onClick={handleBreadcrumbClick}>\n          {hybridBreadcrumb.map((link, index) => {\n            const isCurrentPage = index + 1 === hybridBreadcrumb.length;\n            const linkProps = {};\n            let LinkEl = Fragment;\n\n            if (!isCurrentPage) {\n              if (link.siteLink) {\n                linkProps.property = 'item';\n                linkProps.typeof = 'WebPage';\n                linkProps.href = link.url;\n                LinkEl = A;\n              } else {\n                linkProps.to = link.url;\n                LinkEl = Link;\n              }\n            }\n\n            return (\n              <li key={`${link.url}_${link.text}`} property=\"itemListElement\" typeof=\"ListItem\">\n                <LinkEl {...linkProps}>\n                  {typeof link.text === 'string' ? (\n                    <span property=\"name\" dangerouslySetInnerHTML={{ __html: link.text }}></span>\n                  ) : (\n                    <span property=\"name\">{link.text}</span>\n                  )}\n                  {link.home ? <i aria-hidden=\"true\" className=\"icon icon--home\"></i> : null}\n                  {index + 1 !== hybridBreadcrumb.length ? (\n                    <i aria-hidden=\"true\" className=\"icon icon--chevron-right\"></i>\n                  ) : null}\n                </LinkEl>\n                <meta property=\"position\" content={index + 1} />\n              </li>\n            );\n          })}\n        </OL>,\n        breadcrumbEl\n      )}\n    </>\n  );\n};\n\nexport default Breadcrumb;\n","import React from \"react\";\nexport default (({\n  styles = {},\n  ...props\n}) => <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" {...props}><path d=\"M12.781 5.281l-8 8-.688.719.688.719 8 8 1.438-1.438L7.938 15h13.063c2.754 0 5 2.246 5 5v7h2v-7c0-3.844-3.156-7-7-7H7.938l6.281-6.281z\" /></svg>);","import React from \"react\";\nexport default (({\n  styles = {},\n  ...props\n}) => <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" {...props}><path d=\"M15 5c-1.293 0-2.395.844-2.813 2H3.999v2h8.188c.418 1.156 1.52 2 2.813 2s2.395-.844 2.813-2h10.188V7H17.813c-.418-1.156-1.52-2-2.813-2zm0 2c.563 0 1 .438 1 1s-.438 1-1 1c-.563 0-1-.438-1-1s.438-1 1-1zm7 6c-1.293 0-2.395.844-2.813 2H3.999v2h15.188c.418 1.156 1.52 2 2.813 2s2.395-.844 2.813-2h3.188v-2h-3.188c-.418-1.156-1.52-2-2.813-2zm0 2c.563 0 1 .438 1 1s-.438 1-1 1c-.563 0-1-.438-1-1s.438-1 1-1zm-11 6c-1.293 0-2.395.844-2.813 2H3.999v2h4.188c.418 1.156 1.52 2 2.813 2s2.395-.844 2.813-2h14.188v-2H13.813c-.418-1.156-1.52-2-2.813-2zm0 2c.563 0 1 .438 1 1s-.438 1-1 1c-.563 0-1-.438-1-1s.438-1 1-1z\" /></svg>);","import React from 'react';\nimport styled from 'styled-components';\nimport { minBp, maxBp } from 'src/lib/theme';\nimport { ConfigOptionsBackButtonWrapper, ConfigOptionsBackButton } from 'components/Tray/Tray.styled';\nimport _ChevronRightIcon from 'src/assets/icons/chevron-right.svg';\nimport Container from 'components/_utility/Container';\n\nexport const ActiveFiltersOuter = styled.div`\n  ${({ hideOnMobile }) => `\n    flex: 1;\n    display: ${hideOnMobile ? 'none' : 'block'};\n\n    @media ${minBp('tabletLarge')} {\n      display: block;\n    }\n  `}\n`;\n\nexport const Wrap = styled.div`\n  ${({ visible, filterOpen }) => `  \n    position: fixed;\n    top: 0;\n    left: 0;\n    background-color: white;\n    width: 100%;\n    z-index: 100;\n    padding: 60px 0 60px;\n    height: calc(100% - 60px);\n    margin-top: 60px;\n    display: ${visible ? 'flex' : 'none'};\n    flex-direction: column;\n\n    @media ${minBp('tabletLarge')} {\n      position: absolute;\n      width: 100%;\n      bottom: 100px;\n      top: auto;\n      left: auto;\n      background-color: transparent;\n      height: auto;\n      z-index: 2;\n      padding: 0;\n      display: block;\n    }\n\n    ${ActiveFiltersOuter} {\n      @media ${minBp('tabletLarge')} {\n        display: none;        \n      }\n    }\n  `}\n`;\n\nexport const FilterCards = styled.div`\n  display: flex;\n  flex-direction: column;\n\n  @media ${minBp('tabletLarge')} {\n    flex-direction: row;\n    justify-content: center;\n  }\n`;\n\nexport const Card = styled.div`\n  ${({ active }) => `\n    display: flex;\n    font-size: 16px;\n    padding: 9px 0;\n    border-bottom: 1px solid #e0e0e0;\n    margin-bottom: 4px;\n    position: relative;\n    align-items: center;\n\n    @media ${minBp('additional.mobile')} {\n      padding: 12px 0;\n    }\n\n    @media ${minBp('tabletLarge')} {\n      margin: 0 30px;\n      width: 160px;\n      height: 160px;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      background-color: ${active ? 'black' : 'white'};\n      color: ${active ? 'white' : 'black'};\n      box-shadow: 0 0 32px 0 rgba(0, 0, 0, 0.1);\n      font-size: 14px;\n      cursor: pointer;\n      padding: 0;\n      border: 0;\n    }\n  `}\n`;\n\nexport const CardIcon = styled.div`\n  ${({ active }) => `\n    svg {\n      margin: 0 18px 0 0;\n      vertical-align: middle;\n      position: relative;\n      bottom: 2px;\n      width: 32px;\n      height: 32px;\n    }\n\n    @media ${minBp('additional.mobile')} {\n      svg {\n        width: 35px;\n        height: 35px;\n      }\n    }\n\n    @media ${minBp('tabletLarge')} {\n      svg {\n        margin: 0 0 15px;\n        vertical-align: middle;\n        width: 60px;\n        height: 60px;\n        position: relative;\n        right: auto;\n        bottom: auto;\n\n        path {\n          fill: ${active ? 'white' : 'black'};\n        }\n      }\n    }\n  `}\n`;\n\nexport const CardWrap = styled.div`\n  ${({ active }) => `\n    position: relative;\n\n    @media ${minBp('tabletLarge')} {\n      z-index: ${active ? 11 : 12};\n    }\n  `}\n`;\n\nexport const TitleBar = styled.div`\n  font-weight: 500;\n  font-family: ${({ theme }) => theme.fonts.dinDemi};\n  font-size: 17px;\n  background-color: #eeeeee;\n  text-transform: uppercase;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  line-height: 1;\n  height: 60px;\n  display: flex;\n  align-items: center;\n  padding: 4px 24px 0;\n  position: absolute;\n\n  @media ${minBp('tabletLarge')} {\n    display: none;\n  }\n`;\n\nexport const CloseButton = styled.button`\n  position: absolute;\n  top: 16px;\n  right: 20px;\n  appearance: none;\n  border: 0;\n  background-color: transparent;\n  width: 30px;\n  height: 30px;\n  padding: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  svg {\n    width: 18px;\n    height: 18px;\n  }\n`;\n\nexport const ApplyButtonWrapper = styled(ConfigOptionsBackButtonWrapper)`\n  @media ${minBp('tabletLarge')} {\n    display: none;\n  }\n`;\n\nexport const ApplyButton = styled(ConfigOptionsBackButton)``;\n\nexport const ResultsBar = styled.div`\n  padding-top: 18px;\n  display: flex;\n  justify-content: space-between;\n  border-top: 1px solid #e0e0e0;\n  display: flex;\n  align-items: center;\n\n  @media ${minBp('tabletLarge')} {\n    display: none;\n  }\n`;\n\nexport const ResultsCount = styled.div`\n  font-size: 16px;\n  color: #000;\n  position: relative;\n  top: 2px;\n`;\n\nexport const ResetButton = styled.button`\n  appearance: none;\n  border: 0;\n  border-radius: 4px;\n  padding: 5px 7px;\n  font-size: 12px;\n  background-color: #eaeaea;\n  color: #585a5f;\n\n  svg {\n    width: 14px;\n    height: 14px;\n    vertical-align: middle;\n    position: relative;\n    bottom: 2px;\n    margin-right: 3px;\n\n    path {\n      fill: #585a5f;\n    }\n  }\n`;\n\nexport const ChevronRightIcon = styled(_ChevronRightIcon)`\n  vertical-align: middle;\n  width: 16px;\n  height: 16px;\n  position: absolute;\n  right: 4px;\n  margin: 0;\n\n  path {\n    fill: #000;\n  }\n\n  @media ${minBp('tabletLarge')} {\n    display: none;\n  }\n`;\n\nexport const RefineResults = styled.div`\n  ${({ filterOpen }) => `\n    padding: 25px 30px 0;\n    display: flex;\n\n    @media ${minBp('tabletLarge')} {\n      position: absolute;\n      left: 0;\n      bottom: 0;\n      width: 100%;\n      z-index: ${filterOpen ? 1 : 3};\n      padding: 0;\n    }\n  `}\n`;\n\nexport const RefineResultsInner = styled(Container)`\n  ${({ fluid }) => `\n    display: flex;\n    width: 100%;\n\n    @media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {\n      padding: ${fluid ? '0' : '0 16px !important'};\n    }\n\n    @media ${minBp('tabletLarge')} {\n      ${\n        fluid\n          ? `\n        max-width: 100%;\n        padding-right: 70px;\n      `\n          : `\n        padding: 0 30px;\n      `\n      }\n    }\n\n    @media ${minBp('desktop')} {\n      ${\n        fluid\n          ? `\n        padding: 0 70px 0 0;\n      `\n          : `\n        padding: 0;\n      `\n      }\n    }\n  `}\n`;\n\nexport const FilterButton = styled.button`\n  appearance: none;\n  border: 1px solid #000;\n  padding: 10px 15px;\n  color: #000;\n  background: transparent;\n  width: 100%;\n  text-align: left;\n  font-family: inherit;\n  font-size: inherit;\n  position: relative;\n  margin-right: 4px;\n  flex: 1;\n  min-width: calc(50% - 4px);\n  height: 40px;\n  font-size: 16px;\n\n  svg {\n    position: absolute;\n    top: 0;\n    right: 0;\n    width: 20px;\n    height: 20px;\n    top: 8px;\n    right: 15px;\n\n    path {\n      fill: #000;\n    }\n  }\n\n  @media ${minBp('tabletLarge')} {\n    display: none;\n  }\n`;\n\nexport const FiltersBody = styled.div`\n  padding: 26px;\n  flex: 1;\n  height: calc(100% - 60px);\n  overflow: auto;\n\n  @media ${minBp('tabletLarge')} {\n    padding: 0;\n    flex: none;\n    height: auto;\n    overflow: visible;\n  }\n`;\n","import React from 'react';\nimport styled from 'styled-components';\nimport { minBp } from 'src/lib/theme';\n\nexport const Outer = styled.div`\n  display: flex;\n  height: 61px;\n  margin: 8px 0;\n\n  .rc-slider {\n    position: relative;\n    height: 2px;\n    width: 100%;\n    border-radius: 0;\n    -ms-touch-action: none;\n    touch-action: none;\n    box-sizing: border-box;\n    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n    top: 12px;\n    border-left: 4px solid #bfbfbf;\n    border-right: 4px solid #bfbfbf;\n\n    @media ${minBp('tabletLarge')} {\n      border-left: 4px solid #515151;\n      border-right: 4px solid #515151;\n    }\n  }\n\n  .rc-slider-rail {\n    position: absolute;\n    width: 100%;\n    background-color: #bfbfbf;\n    height: 2px;\n    border-radius: 0px;\n\n    @media ${minBp('tabletLarge')} {\n      background-color: #515151;\n    }\n  }\n\n  .rc-slider-track {\n    position: absolute;\n    left: 0;\n    height: 2px;\n    border-radius: 0px;\n    background-color: #000;\n\n    @media ${minBp('tabletLarge')} {\n      background-color: #fff;\n    }\n  }\n\n  .rc-slider-step {\n    position: absolute;\n    width: 100%;\n    height: 4px;\n    background: transparent;\n  }\n\n  .rc-slider-dot {\n    position: absolute;\n    bottom: -2px;\n    margin-left: -4px;\n    width: 8px;\n    height: 8px;\n    border: 2px solid #e9e9e9;\n    background-color: #fff;\n    cursor: pointer;\n    border-radius: 50%;\n    vertical-align: middle;\n    display: none;\n\n    &-active {\n      border-color: #96dbfa;\n    }\n  }\n\n  .rc-slider-handle {\n    position: absolute;\n    width: 8px;\n    height: 8px;\n    cursor: pointer;\n    cursor: -webkit-grab;\n    margin-top: -3px;\n    cursor: grab;\n    border-radius: 50%;\n    border: 0;\n    background-color: #000;\n    -ms-touch-action: pan-x;\n    touch-action: pan-x;\n\n    @media ${minBp('tabletLarge')} {\n      background-color: #fff;\n    }\n  }\n\n  .rc-slider-mark {\n    position: absolute;\n    top: 18px;\n    left: 0;\n    width: 100%;\n    font-size: 12px;\n  }\n\n  .rc-slider-mark-text {\n    position: absolute;\n    display: inline-block;\n    vertical-align: middle;\n    text-align: center;\n    cursor: pointer;\n    color: #999;\n    display: none;\n\n    &-active {\n      color: #666;\n    }\n  }\n`;\n\nexport const Circle = styled.button`\n  appearance: none;\n  background-color: transparent;\n  width: 26px;\n  height: 26px;\n  min-width: 26px;\n  min-height: 26px;\n  max-width: 26px;\n  max-height: 26px;\n  border-radius: 50%;\n  border: 2px solid #000;\n  position: relative;\n  cursor: pointer;\n  padding: 0;\n\n  &:disabled {\n    opacity: 0.5;\n    cursor: default;\n  }\n\n  svg {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    width: 18px;\n    height: 18px;\n\n    path {\n      fill: #000;\n    }\n  }\n\n  @media ${minBp('tabletLarge')} {\n    border: 2px solid white;\n\n    svg {\n      path {\n        fill: white;\n      }\n    }\n  }\n`;\n\nexport const HandleWrap = styled.div`\n  ${({ left = 0 }) => `\n    left: ${left}%;\n    right: auto;\n    position: relative;\n  `}\n`;\n\nexport const Handle = styled.div`\n  position: absolute;\n  width: 8px;\n  height: 8px;\n  cursor: pointer;\n  cursor: -webkit-grab;\n  margin-top: -3px;\n  cursor: grab;\n  border-radius: 50%;\n  border: 0;\n  background-color: #fff;\n  -ms-touch-action: pan-x;\n  touch-action: pan-x;\n  transform: translateX(-50%);\n`;\n\nexport const Tooltip = styled.div`\n  width: 40px;\n  height: 25px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-weight: 500;\n  font-family: ${({ theme }) => theme.fonts.dinDemi};\n  font-size: 12px;\n  position: absolute;\n  left: 0;\n  transform: translateX(-50%);\n  top: 26px;\n  background-color: #000;\n  border-radius: 4px;\n  cursor: pointer;\n  cursor: -webkit-grab;\n  color: white;\n\n  &:after {\n    content: ' ';\n    position: absolute;\n    top: -6px;\n    left: 50%;\n    transform: translateX(-50%);\n    width: 0;\n    height: 0;\n    border-style: solid;\n    border-width: 0 6px 6px 6px;\n    border-color: transparent transparent #000 transparent;\n  }\n\n  @media ${minBp('tabletLarge')} {\n    background-color: white;\n    color: #000;\n\n    &:after {\n      border-color: transparent transparent white transparent;\n    }\n  }\n`;\n","import React from 'react';\nimport Minus from 'src/assets/icons/minus.svg';\nimport Plus from 'src/assets/icons/plus.svg';\nimport Range from 'rc-slider/lib/Range';\nimport Label from 'src/components/_utility/Label';\nimport { Outer, Tooltip, Circle, Handle, HandleWrap } from './RangeSlider.styled';\n\nconst RangeSlider = ({ onDecreaseQuantity, onIncreaseQuantity, canDecrease, canIncrease, ...props }) => (\n  <Outer>\n    <Circle data-testid=\"rangeMin\" disabled={!canDecrease} onClick={onDecreaseQuantity}>\n      <Minus />\n    </Circle>\n    <Range\n      marks={{ 20: 20, 40: 40, 100: 100 }}\n      step={null}\n      {...props}\n      handle={handleProps => (\n        <HandleWrap left={handleProps.offset}>\n          <Handle role=\"slider\" aria-valuemin={0} aria-valuemax={0} aria-valuenow={0} tabindex={0} {...handleProps} />\n          <Tooltip>{handleProps.index === 0 ? <Label name=\"fromLabel\" /> : <Label name=\"toLabel\" />}</Tooltip>\n        </HandleWrap>\n      )}\n    />\n    <Circle data-testid=\"rangeMax\" disabled={!canIncrease} onClick={onIncreaseQuantity}>\n      <Plus />\n    </Circle>\n  </Outer>\n);\n\nexport default RangeSlider;\n","import React from 'react';\nimport styled from 'styled-components';\nimport { minBp } from 'src/lib/theme';\nimport { TitleBar } from './BikeFilters.styled';\n\nexport const Dialog = styled.div`\n  ${({ hasButton }) => `  \n    position: fixed;\n    top: 60px;\n    left: 0;\n    height: calc(100% - 60px);\n    width: 100%;\n    background-color: white;\n    z-index: 101;\n    padding: 84px 26px ${hasButton ? '78px' : '26px'};\n\n    @media ${minBp('tabletLarge')} {\n      position: absolute;\n      width: 390px;\n      height: auto;\n      border-radius: 4px;\n      background-color: rgba(0, 0, 0, 0.9);\n      padding: 18px 24px;\n      top: calc(100% + 12px);\n      z-index: 1;\n      cursor: default;\n      font-size: 14px;\n      left: 50%;\n      transform: translateX(-50%);\n      z-index: 11;\n\n      &:after {\n        content: ' ';\n        position: absolute;\n        top: -12px;\n        left: 50%;\n        transform: translateX(-50%);\n        width: 0;\n        height: 0;\n        border-style: solid;\n        border-width: 0 12px 12px 12px;\n        border-color: transparent transparent rgba(0, 0, 0, 0.9) transparent;\n      }\n    }\n  `}\n`;\n\nexport const DialogHeader = styled(TitleBar)`\n  @media ${minBp('tabletLarge')} {\n    display: none;\n  }\n`;\n\nexport const FilterTitle = styled.h3`\n  color: #000;\n  font-weight: 500;\n  font-family: ${({ theme }) => theme.fonts.dinDemi};\n  font-size: inherit;\n  margin: 0 0 5px;\n\n  @media ${minBp('tabletLarge')} {\n    margin: 0 0 10px;\n    color: white;\n    font-size: inherit;\n    text-transform: normal;\n    background-color: transparent;\n  }\n`;\n\nexport const Choices = styled.div``;\n\nexport const Description = styled.div`\n  margin-top: 12px;\n  color: #8d8e90;\n\n  @media ${minBp('tabletLarge')} {\n    margin-top: 10px;\n  }\n`;\n\nexport const RangeDescription = styled.div`\n  color: #8d8e90;\n  margin-bottom: 12px;\n\n  span {\n    font-family: ${({ theme }) => theme.fonts.dinDemi};\n    font-weight: 500;\n    color: #000;\n  }\n\n  @media ${minBp('tabletLarge')} {\n    span {\n      color: white;\n    }\n  }\n`;\n\nexport const ClickCatch = styled.div`\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  z-index: 10;\n`;\n\nexport const BackButton = styled.div`\n  padding: 5px;\n  position: relative;\n  bottom: 1px;\n  left: -5px;\n\n  svg {\n    width: 16px;\n    height: 16px;\n    vertical-align: middle;\n\n    path {\n      fill: #585a5f;\n    }\n  }\n`;\n\nexport const OptionsWrap = styled.div``;\n\nexport const DescriptionWrap = styled.div`\n  border-bottom: 1px solid #e0e0e0;\n  margin-bottom: 20px;\n  padding-bottom: 17px;\n\n  @media ${minBp('tabletLarge')} {\n    border: 0;\n    margin: 0;\n    padding: 0;\n  }\n`;\n\nexport const DialogBody = styled.div`\n  display: flex;\n  flex-direction: column-reverse;\n  max-height: 100%;\n  overflow-y: auto;\n  overflow-x: hidden;\n\n  @media ${minBp('tabletLarge')} {\n    flex-direction: column;\n    overflow-y: hidden;\n  }\n`;\n\nexport const FilterIcon = styled.div`\n  position: relative;\n\n  svg {\n    vertical-align: middle;\n    width: 32px;\n    height: 32px;\n  }\n\n  @media ${minBp('tabletLarge')} {\n    display: none;\n  }\n`;\n\nexport const ResetFilterButton = styled.button`\n  appearance: none;\n  border: 0;\n  border-radius: 4px;\n  padding: 5px 7px;\n  font-size: 12px;\n  background-color: #eaeaea;\n  color: #585a5f;\n  position: absolute;\n  bottom: 3px;\n  right: 0;\n\n  svg {\n    width: 14px;\n    height: 14px;\n    vertical-align: middle;\n    position: relative;\n    bottom: 2px;\n    margin-right: 3px;\n\n    path {\n      fill: #585a5f;\n    }\n  }\n`;\n\nexport const ScrollIndicator = styled.div`\n  position: absolute;\n  bottom: 0px;\n  left: 0;\n  width: 100%;\n  height: 25px;\n  padding: 3px;\n  background-color: #eeeeee;\n\n  svg {\n    position: absolute;\n    left: 50%;\n    transform: translateX(-50%);\n    width: 20px;\n    height: 20px;\n\n    path {\n      fill: #585a5f;\n    }\n  }\n`;\n","import React, { Fragment, useRef, useEffect, useState } from 'react';\nimport SVG from 'react-inlinesvg';\nimport { useSelector, useDispatch } from 'react-redux';\nimport Label from 'src/components/_utility/Label';\nimport Radio from 'components/_form/Radio/Radio';\nimport RangeSlider from 'components/_form/RangeSlider/RangeSlider';\nimport { setFilterChoice, setFilterRange, setActiveFilter, resetFilter } from 'src/redux/bikes/actions';\nimport BackIcon from 'src/assets/icons/chevron-left.svg';\nimport { filtersSelector } from 'src/redux/app/selectors';\nimport { getBikeFilter, isFilterSet } from 'src/redux/bikes/selectors';\nimport { getImageBaseUrl } from 'helpers/request';\nimport ResetIcon from 'src/assets/icons/reset.svg';\nimport ArrowDown from 'src/assets/icons/arrow-down.svg';\nimport { isIOS } from 'helpers/utilities';\nimport useDataLayer from 'src/hooks/useDataLayer';\nimport {\n  ClickCatch,\n  Dialog,\n  DialogHeader,\n  Description,\n  RangeDescription,\n  BackButton,\n  OptionsWrap,\n  FilterTitle,\n  DialogBody,\n  DescriptionWrap,\n  FilterIcon,\n  ResetFilterButton,\n  ScrollIndicator,\n} from './FilterDialog.styled';\n\nconst Range = ({ filterIndex, bikeFilter }) => {\n  const dispatch = useDispatch();\n  const pushToDataLayer = useDataLayer();\n\n  const { from: bikeFilterFrom, to: bikeFilterTo, min: floor, max: ceiling } = useSelector(getBikeFilter(filterIndex));\n\n  const fromValue = bikeFilter.values.find(value => parseInt(value.value, 10) === bikeFilterFrom);\n  const toValue = bikeFilter.values.find(value => parseInt(value.value, 10) === bikeFilterTo);\n  const fromText = fromValue.text;\n  const toText = toValue.text;\n  const fromIndex = bikeFilter.values.indexOf(fromValue);\n  const toIndex = bikeFilter.values.indexOf(toValue);\n\n  const canIncrease = bikeFilterTo < ceiling;\n  const canDecrease = bikeFilterFrom > floor;\n\n  const handleIncrease = () => {\n    dispatch(\n      setFilterRange({\n        filter: filterIndex,\n        to: parseInt(bikeFilter.values[toIndex + 1].value, 10),\n        from: bikeFilterFrom,\n      })\n    );\n  };\n\n  const handleDecrease = () => {\n    dispatch(\n      setFilterRange({\n        filter: filterIndex,\n        from: parseInt(bikeFilter.values[fromIndex - 1].value, 10),\n        to: bikeFilterTo,\n      })\n    );\n  };\n\n  const marks = bikeFilter.values.reduce((prevMarks, filter) => {\n    prevMarks[parseInt(filter.value, 10)] = parseInt(filter.value, 10);\n\n    return prevMarks;\n  }, {});\n\n  return (\n    <Fragment>\n      <RangeDescription>\n        <Label name=\"fromLabel\" /> <span>{fromText}</span> <Label name=\"toLabel\" factory={val => val.toLowerCase()} />{' '}\n        <span>{toText}</span>\n      </RangeDescription>\n      <RangeSlider\n        min={floor}\n        max={ceiling}\n        value={[bikeFilterFrom, bikeFilterTo]}\n        onChange={([from, to]) => {\n          pushToDataLayer(`configuratorFilter${filterIndex + 1}`, {\n            configuratorFilter: `${from}-${to}`,\n          });\n          dispatch(setFilterRange({ filter: filterIndex, from, to }));\n        }}\n        step={null}\n        marks={marks}\n        onDecreaseQuantity={handleDecrease}\n        onIncreaseQuantity={handleIncrease}\n        canDecrease={canDecrease}\n        canIncrease={canIncrease}\n      />\n    </Fragment>\n  );\n};\n\nconst Choice = ({ filterIndex, values = [] }) => {\n  const dispatch = useDispatch();\n  const pushToDataLayer = useDataLayer();\n  const { choice } = useSelector(getBikeFilter(filterIndex));\n\n  return (\n    <Fragment>\n      <Radio\n        id={`${filterIndex}-show-all`}\n        label=\"showAllLabel\"\n        data-testid=\"showAll\"\n        checked={!choice}\n        onChange={() => {\n          pushToDataLayer(`configuratorFilter${filterIndex + 1}`, {\n            configuratorFilter: 'Show all',\n          });\n          dispatch(setFilterChoice({ filter: filterIndex, choice: null }));\n        }}\n        isWhite\n      />\n      {values.map(option => (\n        <Radio\n          id={option.value}\n          key={option.value}\n          data-testid={option.value}\n          label={option.text}\n          checked={choice === option.value}\n          onChange={() => {\n            pushToDataLayer(`configuratorFilter${filterIndex + 1}`, {\n              configuratorFilter: option.text,\n            });\n            dispatch(setFilterChoice({ filter: filterIndex, choice: option.value }));\n          }}\n          isWhite\n        />\n      ))}\n    </Fragment>\n  );\n};\n\nconst FilterDialog = ({ filterIndex, title, description, type, values, icon }) => {\n  const [scrollIndicatorVisible, setScrollIndicatorVisible] = useState(false);\n  const dispatch = useDispatch();\n  const filters = useSelector(filtersSelector);\n  const filterSet = useSelector(isFilterSet(filterIndex));\n  const bikeFilter = filters[filterIndex];\n  const dialogBodyRef = useRef();\n\n  const componentSwitch = {\n    slider: Range,\n    options: Choice,\n  };\n  const FilterBody = componentSwitch[type];\n\n  useEffect(() => {\n    const dialogBodyEl = dialogBodyRef.current;\n\n    setTimeout(() => {\n      dialogBodyEl.scrollTop = isIOS() ? -(dialogBodyEl.scrollHeight - dialogBodyEl.getBoundingClientRect().height) : 0;\n    });\n\n    const handleDialogBodyScroll = () => {\n      const getScrollTop = el => {\n        if (isIOS()) {\n          return el.scrollTop + el.scrollHeight - el.getBoundingClientRect().height;\n        }\n\n        return el.scrollTop;\n      };\n\n      setScrollIndicatorVisible(\n        getScrollTop(dialogBodyEl) + dialogBodyEl.getBoundingClientRect().height < dialogBodyEl.scrollHeight\n      );\n    };\n\n    dialogBodyEl.addEventListener('scroll', handleDialogBodyScroll);\n  }, []);\n\n  return (\n    <>\n      <ClickCatch data-testid=\"clickCatch\" onClick={() => dispatch(setActiveFilter(null))} />\n      <Dialog>\n        <DialogHeader>\n          <BackButton data-testid=\"backButton\" onClick={() => dispatch(setActiveFilter(null))}>\n            <BackIcon />\n          </BackButton>\n          {title}\n        </DialogHeader>\n        <DialogBody ref={dialogBodyRef}>\n          <OptionsWrap>\n            <FilterTitle>{title}</FilterTitle>\n            {FilterBody ? <FilterBody filterIndex={filterIndex} bikeFilter={bikeFilter} values={values} /> : null}\n          </OptionsWrap>\n          <DescriptionWrap>\n            <FilterIcon>\n              <SVG src={getImageBaseUrl() + icon} alt={title} />\n              {filterSet ? (\n                <ResetFilterButton data-testid=\"resetFilter\" onClick={() => dispatch(resetFilter(filterIndex))}>\n                  <ResetIcon></ResetIcon>\n                  <Label name=\"resetFilterLabel\" />\n                </ResetFilterButton>\n              ) : null}\n            </FilterIcon>\n            {description ? <Description>{description}</Description> : null}\n          </DescriptionWrap>\n        </DialogBody>\n        {scrollIndicatorVisible ? (\n          <ScrollIndicator>\n            <ArrowDown />\n          </ScrollIndicator>\n        ) : null}\n      </Dialog>\n    </>\n  );\n};\n\nexport default FilterDialog;\n","import React from 'react';\nimport SVG from 'react-inlinesvg';\nimport { getImageBaseUrl } from 'helpers/request';\nimport { Card, CardWrap, ChevronRightIcon, CardIcon } from './BikeFilters.styled';\nimport FilterDialog from './FilterDialog';\n\nconst FilterCard = ({ index, title, active, icon, type, values, description, onSelectCard, children }) => (\n  <CardWrap active={active}>\n    <Card active={active} onClick={() => (active ? onSelectCard(null) : onSelectCard(index))} thin>\n      {icon ? (\n        <CardIcon active={active}>\n          <SVG src={getImageBaseUrl() + icon} alt={title} />\n        </CardIcon>\n      ) : null}\n      {title}\n      {children}\n      <ChevronRightIcon />\n    </Card>\n    {active ? (\n      <FilterDialog\n        filterIndex={index}\n        type={type}\n        title={title}\n        description={description}\n        values={values}\n        icon={icon}\n      />\n    ) : null}\n  </CardWrap>\n);\n\nexport default FilterCard;\n","import React from 'react';\nimport styled from 'styled-components';\nimport Container from 'components/_utility/Container';\nimport { minBp } from 'src/lib/theme';\n\nexport const Wrap = styled(Container)`\n  ${({ fluid }) => `\n    width: 100%;\n    flex: 1;\n    padding: 10px 0;\n\n    @media ${minBp('tabletLarge')} {\n      flex: 1;\n      padding: 0;\n\n      ${\n        fluid\n          ? `\n        max-width: 100%;\n        padding-left: 100px;\n\n        @media ${minBp('desktop')} {\n          padding-left: 100px;\n        }\n      `\n          : ``\n      }\n    }\n  `}\n`;\n\nexport const Option = styled.div`\n  appearance: none;\n  display: inline-flex;\n  border-radius: 4px;\n  background-color: #2a2a2a;\n  color: white;\n  border: 0;\n  font-size: 12px;\n  padding: 2px 6px 0 6px;\n  line-height: 1;\n  height: 24px;\n  align-items: center;\n  justify-content: center;\n  margin: 0 6px 6px 0;\n  cursor: pointer;\n\n  @media ${minBp('tabletLarge')} {\n    height: 32px;\n    font-size: 16px;\n  }\n`;\n\nexport const Close = styled.button`\n  appearance: none;\n  margin-right: 4px;\n  background: transparent;\n  width: 16px;\n  height: 16px;\n  border: 0;\n  padding: 0;\n  pointer-events: none;\n  font-size: 12px;\n\n  svg {\n    height: 16px;\n    width: 16px;\n    vertical-align: middle;\n    position: relative;\n    bottom: 1px;\n\n    path {\n      fill: white;\n    }\n  }\n`;\n","import React from 'react';\nimport { useSelector, useDispatch } from 'react-redux';\nimport { getFilters } from 'src/redux/bikes/selectors';\nimport Label from 'components/_utility/Label';\nimport CloseIcon from 'src/assets/icons/close.svg';\nimport { filtersSelector } from 'src/redux/app/selectors';\nimport { resetFilter } from 'src/redux/bikes/actions';\nimport { Wrap, Option, Close } from './ActiveFilters.styled';\n\nconst RangeLabel = ({ from, to, values }) => {\n  const fromValue = values.find(value => parseInt(value.value, 10) === from);\n  const toValue = values.find(value => parseInt(value.value, 10) === to);\n  const fromText = fromValue.text;\n  const toText = toValue.text;\n\n  return (\n    <>\n      {fromText} <Label name=\"toLabel\" factory={label => label.toLowerCase()} /> {toText}\n    </>\n  );\n};\n\nconst ChoiceLabel = ({ choice: choiceId, values }) => {\n  const choice = values.find(value => value.value === choiceId);\n\n  return <>{choice.text}</>;\n};\n\nconst ActiveFilters = ({ fluid }) => {\n  const dispatch = useDispatch();\n  const filters = useSelector(filtersSelector);\n  const filtersState = useSelector(getFilters);\n\n  const activeFilters = filters\n    .map((filter, index) => {\n      const filterState = filtersState[index];\n\n      if (\n        !filterState ||\n        (filter.type === 'options' && !filterState.choice) ||\n        (filter.type === 'slider' && filterState.from === filterState.min && filterState.to === filterState.max)\n      ) {\n        return null;\n      }\n\n      return { index, ...filter, ...filterState };\n    })\n    .filter(filter => filter);\n\n  return (\n    <Wrap fluid={fluid}>\n      {activeFilters.map(activeFilter => (\n        <Option key={activeFilter.index} onClick={() => dispatch(resetFilter(activeFilter.index))}>\n          <Close>\n            <CloseIcon />\n          </Close>\n          {activeFilter.type === 'slider' ? <RangeLabel {...activeFilter} /> : <ChoiceLabel {...activeFilter} />}\n        </Option>\n      ))}\n    </Wrap>\n  );\n};\n\nexport default ActiveFilters;\n","import React from \"react\";\nexport default (({\n  styles = {},\n  ...props\n}) => <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" {...props}><path d=\"M5 5v22h22V5zm2 2h5v5H7zm7 0h4v5h-4zm6 0h5v5h-5zM7 14h5v4H7zm7 0h4v4h-4zm6 0h5v4h-5zM7 20h5v5H7zm7 0h4v5h-4zm6 0h5v5h-5z\" /></svg>);","import React from \"react\";\nexport default (({\n  styles = {},\n  ...props\n}) => <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" {...props}><path d=\"M4 5v6h6V5zm2 2h2v2H6zm6 0v2h15V7zm-8 6v6h6v-6zm2 2h2v2H6zm6 0v2h15v-2zm-8 6v6h6v-6zm2 2h2v2H6zm6 0v2h15v-2z\" /></svg>);","export const sendGaEvent = (action, label) => window.ga('send', 'event', 'Configurator', action, label);\n","import React from 'react';\nimport styled from 'styled-components';\nimport { minBp } from 'src/lib/theme';\n\nexport const ViewWrap = styled.div`\n  display: none;\n\n  @media ${minBp('tabletLarge')} {\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n    z-index: 1;\n  }\n`;\n\nexport const LabelWrap = styled.div`\n  margin-right: 10px;\n  color: #000;\n`;\n\nexport const IconWrap = styled.div`\n  ${({ active }) => `\n    cursor: pointer;\n\n    &:not(:last-of-type) {\n      margin-right: 4px;\n    }\n\n    svg {\n      path {\n        fill: ${active ? '#000' : '#c1c1c1'};\n      }\n    }\n  `}\n`;\n\nexport const SelectWrap = styled.div`\n  border: 1px solid #000;\n  position: relative;\n  margin-left: 4px;\n  flex: 1;\n  min-width: 50%;\n\n  svg {\n    position: absolute;\n    top: 10px;\n    right: 8px;\n    width: 16px;\n    height: 16px;\n    pointer-events: none;\n  }\n\n  @media ${minBp('tabletLarge')} {\n    min-width: 140px;\n    flex: none;\n    margin-left: 20px;\n\n    svg {\n      top: 12px;\n    }\n  }\n`;\n\nexport const Select = styled.select`\n  appearance: none;\n  border: 0;\n  border-radius: 0;\n  padding: 10px 35px 8px 15px;\n  margin: 0;\n  color: #000;\n  background: transparent;\n  width: 100%;\n  text-align: left;\n  font-family: inherit;\n  font-size: 16px;\n\n  &:focus {\n    border: 0;\n    outline: 2px auto #9ecaed;\n    outline: 2px auto -webkit-focus-ring-color;\n    outline-offset: 5px;\n    transition: none;\n  }\n`;\n","import React, { useEffect } from 'react';\nimport { useSelector, useDispatch } from 'react-redux';\nimport Label from 'src/components/_utility/Label';\nimport GridView from 'src/assets/icons/grid-view.svg';\nimport ListView from 'src/assets/icons/list-view.svg';\nimport { getBikesView, getBikesSort } from 'src/redux/bikes/selectors';\nimport { setView, setSort } from 'src/redux/bikes/actions';\nimport ArrowDown from 'src/assets/icons/arrow-down.svg';\nimport sortOptions from 'src/config/sortOptions.config';\nimport useLabel from 'src/hooks/useLabel';\nimport { sendGaEvent } from 'helpers/analytics';\nimport { getViewportWidth } from 'helpers/utilities';\nimport theme from 'src/lib/theme';\nimport { ViewWrap, IconWrap, LabelWrap, SelectWrap, Select } from './ViewAndSort.styled';\n\nconst ViewAndSort = ({ viewHidden }) => {\n  const dispatch = useDispatch();\n  const bikeView = useSelector(getBikesView);\n  const sortValue = useSelector(getBikesSort);\n  const getLabel = useLabel();\n\n  useEffect(() => {\n    const setToGrid = () => {\n      if (getViewportWidth() < theme.breakpoints.tabletLarge) {\n        dispatch(setView('grid'));\n      }\n    };\n\n    window.addEventListener('resize', setToGrid);\n\n    return () => window.removeEventListener('resize', setToGrid);\n  }, []);\n\n  return (\n    <>\n      <ViewWrap>\n        {!viewHidden ? (\n          <>\n            <LabelWrap>\n              <Label name=\"viewLabel\" />\n            </LabelWrap>\n            <IconWrap\n              active={bikeView === 'grid'}\n              onClick={() => [dispatch(setView('grid')), sendGaEvent('View', 'Grid')]}\n            >\n              <GridView />\n            </IconWrap>\n            <IconWrap\n              active={bikeView === 'list'}\n              onClick={() => [dispatch(setView('list')), sendGaEvent('View', 'List')]}\n            >\n              <ListView />\n            </IconWrap>\n          </>\n        ) : null}\n      </ViewWrap>\n      <SelectWrap>\n        <Select\n          tabIndex=\"0\"\n          value={sortValue}\n          onChange={event => [dispatch(setSort(event.target.value)), sendGaEvent('Sort By', event.target.value)]}\n        >\n          <option value=\"\" disabled>\n            {getLabel('sortByLabel')}\n          </option>\n          {sortOptions.map(sortOption => (\n            <option key={sortOption.id} value={sortOption.id}>\n              {getLabel(sortOption.label)}\n            </option>\n          ))}\n        </Select>\n        <ArrowDown />\n      </SelectWrap>\n    </>\n  );\n};\n\nexport default ViewAndSort;\n","import React, { Fragment, useEffect } from 'react';\nimport { useSelector, useDispatch } from 'react-redux';\nimport {\n  activeFilterSelector,\n  areFiltersSet,\n  getFiltersOpen,\n  bikesSelector,\n  getFeatureCardCount,\n} from 'src/redux/bikes/selectors';\nimport {\n  setActiveFilter,\n  clearFilters,\n  openFiltersModal,\n  closeFiltersModal,\n  applyFilters,\n} from 'src/redux/bikes/actions';\nimport { filtersSelector } from 'src/redux/app/selectors';\nimport CloseIcon from 'src/assets/icons/close.svg';\nimport ResetIcon from 'src/assets/icons/reset.svg';\nimport FiltersIcon from 'src/assets/icons/filters.svg';\nimport Label from 'components/_utility/Label';\nimport { bodyNoScroll } from 'helpers/utilities';\nimport usePrevious from 'src/hooks/usePrevious';\nimport {\n  Wrap,\n  FilterCards,\n  TitleBar,\n  CloseButton,\n  ApplyButtonWrapper,\n  ApplyButton,\n  ResultsBar,\n  ResultsCount,\n  ResetButton,\n  RefineResults,\n  RefineResultsInner,\n  FilterButton,\n  ActiveFiltersOuter,\n  FiltersBody,\n} from './BikeFilters.styled';\nimport FilterCard from './FilterCard';\nimport ActiveFilters from './ActiveFilters';\nimport ViewAndSort from './ViewAndSort';\n\nconst BikeFilters = ({ fluid, viewHidden = false, isFamilyPage = false, isGenrePage = false }) => {\n  const dispatch = useDispatch();\n  const filters = useSelector(filtersSelector);\n  const openFilterIndex = useSelector(activeFilterSelector);\n  const filtersSet = useSelector(areFiltersSet);\n  const filtersOpen = useSelector(getFiltersOpen);\n  const { filteredCount: bikeCardCount } = useSelector(bikesSelector);\n  const featureCardCount = useSelector(getFeatureCardCount(isFamilyPage ? 'family' : 'genre'));\n  const previousFiltersOpen = usePrevious(filtersOpen);\n  const count = isFamilyPage || isGenrePage ? featureCardCount : bikeCardCount;\n\n  const handleSelectCard = filterId => dispatch(setActiveFilter(filterId));\n\n  const filterOpen = typeof openFilterIndex === 'number';\n\n  useEffect(() => {\n    if (filtersOpen) {\n      bodyNoScroll.add();\n    }\n\n    if (!filtersOpen && previousFiltersOpen) {\n      bodyNoScroll.remove();\n    }\n  }, [filtersOpen, previousFiltersOpen]);\n\n  useEffect(() => {\n    const closeFiltersOnOrientationChange = () => {\n      if (filtersOpen) {\n        handleSelectCard(null);\n        bodyNoScroll.remove();\n      }\n    };\n\n    window.addEventListener('resize', closeFiltersOnOrientationChange);\n\n    return () => window.removeEventListener('resize', closeFiltersOnOrientationChange);\n  });\n\n  return (\n    <Fragment>\n      <Wrap visible={filtersOpen} filterOpen={filterOpen}>\n        <TitleBar>\n          <Label name=\"filtersLabel\" />\n          <CloseButton data-testid=\"closeFiltersBtn\" onClick={() => dispatch(closeFiltersModal())}>\n            <CloseIcon />\n          </CloseButton>\n        </TitleBar>\n        <FiltersBody>\n          <FilterCards>\n            {filters.map((filter, index) => {\n              const active = index === openFilterIndex;\n\n              return (\n                <FilterCard {...filter} key={index} index={index} onSelectCard={handleSelectCard} active={active} />\n              ); // Used index as key here, as confident order of this array won't change\n            })}\n          </FilterCards>\n          <ActiveFiltersOuter>\n            <ActiveFilters fluid={fluid} />\n          </ActiveFiltersOuter>\n          {filtersSet ? (\n            <ResultsBar>\n              <ResultsCount>\n                <strong>{count}</strong> <Label name=\"resultsLabel\" />\n              </ResultsCount>\n              <ResetButton data-testid=\"clearFiltersBtn\" onClick={() => dispatch(clearFilters())}>\n                <ResetIcon></ResetIcon>\n                <Label name=\"clearFiltersLabel\" />\n              </ResetButton>\n            </ResultsBar>\n          ) : null}\n        </FiltersBody>\n        <ApplyButtonWrapper>\n          <ApplyButton onClick={() => dispatch(applyFilters())}>\n            <Label name=\"applyFiltersLabel\" />\n          </ApplyButton>\n        </ApplyButtonWrapper>\n      </Wrap>\n      <RefineResults filterOpen={filterOpen}>\n        <RefineResultsInner fluid={fluid}>\n          <ActiveFiltersOuter hideOnMobile>\n            <ActiveFilters fluid={fluid} />\n          </ActiveFiltersOuter>\n          <FilterButton onClick={() => dispatch(openFiltersModal())} data-testid=\"openFiltersBtn\">\n            <Label name=\"filtersLabel\" />\n            <FiltersIcon></FiltersIcon>\n          </FilterButton>\n          <ViewAndSort viewHidden={viewHidden}></ViewAndSort>\n        </RefineResultsInner>\n      </RefineResults>\n    </Fragment>\n  );\n};\n\nexport default BikeFilters;\n","import React from 'react';\nimport styled, { keyframes } from 'styled-components';\nimport Link from 'components/_utility/Link/Link';\nimport { minBp } from '../../lib/theme';\n// Stop styled-components passing primary prop into Link\nconst _Link = ({ primary, ...props }) => <Link {...props} />; // eslint-disable-line\n\nexport const Wrap = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: #fff;\n  width: 100%;\n  padding: 10px 30px;\n  height: 60px;\n`;\n\nexport const Message = styled.span`\n  color: #585a5f;\n  font-size: 12px;\n  text-align: center;\n  display: inline-block;\n\n  @media ${minBp('tablet')} {\n    font-size: 15px;\n  }\n`;\n\nexport const CTA = styled(_Link)`\n  color: #000;\n  text-transform: uppercase;\n  display: inline-block;\n  font-weight: 700;\n  font-size: 12px;\n  text-decoration: none;\n  position: relative;\n  margin-left: 4px;\n\n  @media ${minBp('tablet')} {\n    font-size: 15px;\n  }\n\n  svg {\n    height: 12px;\n    width: 12px;\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    right: -15px;\n\n    @media ${minBp('tablet')} {\n      height: 15px;\n      width: 15px;\n    }\n\n    path {\n      fill: #000;\n    }\n  }\n`;\n","import React, { useEffect } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useDispatch, useSelector } from 'react-redux';\nimport Label from 'components/_utility/Label';\nimport ChevronRight from 'src/assets/icons/chevron-right.svg';\n\nimport { getConfigurations } from 'src/redux/garage/selectors';\nimport { setConfigurations } from 'src/redux/garage/actions';\nimport request from 'helpers/request';\nimport { Wrap, Message, CTA } from './NotificationStrip.styled';\n\nconst NotificationStrip = () => (\n  <Wrap>\n    <Message>\n      <Label name=\"previouslySavedBikesLabel\" />\n      <CTA to=\"/garage\">\n        <Label name=\"myGarageLabel\" /> <ChevronRight />\n      </CTA>\n    </Message>\n  </Wrap>\n);\n\nexport const NotificationStripPortal = () => {\n  const dispatch = useDispatch();\n  const userEmail = window.localStorage.getItem('garageEmailAddress');\n  const configurations = useSelector(getConfigurations);\n  let notificationStripEl = document.querySelector('.notification-strip');\n  const breadcrumbEl = document.querySelector('.breadcrumb');\n\n  if (!notificationStripEl && breadcrumbEl?.parentNode) {\n    notificationStripEl = document.createElement('div');\n    breadcrumbEl.parentNode.insertBefore(notificationStripEl, breadcrumbEl);\n  }\n\n  useEffect(() => {\n    if (!userEmail) {\n      return;\n    }\n\n    const fetchConfigurations = async () => {\n      const { data } = await request(`/api/configurator/garage?user=${userEmail}`);\n\n      dispatch(setConfigurations(data ? data.configurations : []));\n    };\n\n    fetchConfigurations();\n  }, [dispatch, userEmail]);\n\n  return (userEmail && configurations.length && createPortal(<NotificationStrip />, notificationStripEl)) || null;\n};\n\nexport default NotificationStrip;\n","import React from 'react';\nimport styled, { css } from 'styled-components';\nimport Button, { LinkButton } from 'components/Button/Button';\nimport { minBp } from '../../lib/theme';\n\nexport const Outer = styled.div`\n  position: relative;\n  z-index: 3;\n\n  @media ${minBp('tabletLarge')} {\n    padding-bottom: 160px;\n  }\n`;\n\nexport const Container = styled.div`\n  ${({ theme, hasFilters }) => `\n    height: 214px;\n    position: relative;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    flex-wrap: wrap;\n\n    @media ${minBp('mobileEnd')} {\n      height: 500px;\n    }\n\n    @media ${minBp('tabletLarge')} {\n      ${\n        hasFilters\n          ? `\n        padding-bottom: 40px;\n      `\n          : ``\n      }\n    }\n  `}\n`;\n\nexport const ContentWrap = styled.div`\n  ${({ theme }) => `\n    display: flex;\n    flex-direction: column;\n    padding: 0 30px;\n    min-height: 200px;\n    justify-content: center;\n    height: 100%;\n    width: 100%;\n    position: relative;\n\n    @media ${minBp('tabletLarge')} {\n      padding: 0;\n    }\n  `}\n`;\n\nexport const Title = styled.h2`\n  display: flex;\n  justify-content: center;\n  font-weight: 500;\n  text-transform: uppercase;\n  width: 100%;\n  text-align: center;\n  margin-bottom: 18px;\n  font-size: 32px;\n  line-height: 32px;\n  font-family: ${({ theme }) => theme.fonts.dinDemi};\n  color: #fff;\n  position: relative;\n\n  @media ${minBp('tablet')} {\n    font-size: 50px;\n    line-height: 50px;\n  }\n\n  @media ${minBp('tabletLarge')} {\n    font-size: 80px;\n    line-height: 80px;\n\n    &:not(:last-of-type) {\n      margin-bottom: 40px;\n    }\n  }\n`;\n\nexport const ButtonWrapper = styled.div`\n  ${({ theme }) => `\n    display: flex;\n    flex-direction: row;\n    flex-wrap: wrap;\n    justify-content: center;\n    position: absolute;\n    top: 65%;\n    left: 50%;\n    transform: translateX(-50%);\n    width: 100%;\n\n    @media ${minBp('tablet')} { \n      top: 60%;\n      width: auto;\n      min-width: 500px;\n    }\n\n    @media ${minBp('tabletLarge')} {\n      flex-wrap: nowrap;\n      top: inherit;\n      left: inherit;\n      transform: none;\n      width: 100%;\n      position: relative;\n    }\n  `}\n`;\n\nexport const HeroButtonStyle = css`\n  ${({ whiteBackground, theme }) => `\n    display: flex;\n    flex-basis: calc(50% - 8px);\n    margin: 4px;\n    height: 32px;\n    padding: 2px 0 0;\n    font-size: 12px;\n    text-transform: uppercase;\n    justify-content: center;\n    cursor: pointer;\n    white-space: nowrap;\n\n    &:focus {\n        color: ${theme.colors.buttons.default};\n        background-color: ${theme.colors.buttons.white};\n    }\n\n    @media ${minBp('tabletLarge')} {\n      height: 40px;\n      margin: 0 20px;\n      flex-basis: calc(50% - 20px);\n      font-size: 17px;\n      padding: 11px 20px 8px;\n      max-width: 271px;\n    }\n\n    ${whiteBackground &&\n      `color: ${theme.colors.buttons.default};\n      background-color: ${theme.colors.buttons.white};\n\n      &:focus {\n        color: ${theme.colors.buttons.white};\n        background-color: ${theme.colors.buttons.default};\n      }`}\n  `}\n`;\n\nconst _Button = ({ whiteBackground, ...props }) => <Button {...props} />;\n\nexport const HeroButton = styled(_Button)`\n  ${HeroButtonStyle};\n`;\n\nconst _LinkButton = ({ whiteBackground, ...props }) => <LinkButton {...props} />;\n\nexport const HeroLinkButton = styled(_LinkButton)`\n  ${HeroButtonStyle};\n`;\n\nexport const HeroImageWrapper = styled.div`\n  position: absolute;\n  height: 100%;\n  width: 100%;\n  top: 0;\n  left: 0;\n  background-color: #585a5f;\n`;\n\nexport const HeroImage = styled.div``;\n","import React from 'react';\nimport styled from 'styled-components';\n\nexport const BackgroundImageContainer = styled.div`\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n`;\n\nexport const BackgroundImageWrapper = styled.div`\n  height: 100%;\n  width: 100%;\n  position: absolute;\n\n  img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n  }\n`;\n","import React, { useEffect } from 'react';\n// TODO: Null checks and tests\n\nimport ResponsiveImage from './ResponsiveImage';\n\nimport 'objectFitPolyfill';\n\nimport { BackgroundImageContainer, BackgroundImageWrapper } from './BackgroundImage.styled';\n\nconst BackgroundImage = ({ mobile, tablet, tabletLarge, desktop, alt }) => {\n  useEffect(() => {\n    window.objectFitPolyfill();\n  }, []);\n\n  return (\n    <BackgroundImageContainer>\n      <BackgroundImageWrapper>\n        <ResponsiveImage\n          mobile={mobile}\n          tablet={tablet}\n          tabletLarge={tabletLarge}\n          desktop={desktop}\n          alt={alt}\n          data-object-fit\n        />\n      </BackgroundImageWrapper>\n    </BackgroundImageContainer>\n  );\n};\n\nexport default BackgroundImage;\n","import React from 'react';\n\nimport Label from 'components/_utility/Label';\nimport { getImageBaseUrl } from 'helpers/request';\nimport BikeFilters from 'src/components/BikeFilters/BikeFilters';\n\nimport { NotificationStripPortal } from 'components/NotificationStrip/NotificationStrip';\nimport {\n  Outer,\n  Container,\n  ContentWrap,\n  Title,\n  ButtonWrapper,\n  HeroButton,\n  HeroImageWrapper,\n  HeroLinkButton,\n} from './Hero.styled';\n\nimport BackgroundImage from '../_utility/BackgroundImage/BackgroundImage';\n\nconst Hero = ({\n  buttons = [],\n  title,\n  image,\n  fluid,\n  viewHidden,\n  hasFilters,\n  isFamilyPage = false,\n  isGenrePage = false,\n}) => (\n  <>\n    <NotificationStripPortal />\n    <Outer>\n      <Container hasFilters={hasFilters}>\n        <HeroImageWrapper>\n          {image ? (\n            <BackgroundImage\n              mobile={getImageBaseUrl() + image.srcSmall}\n              tablet={getImageBaseUrl() + image.srcMedium}\n              tabletLarge={getImageBaseUrl() + image.srcLarge}\n              alt={image.alt}\n            />\n          ) : null}\n        </HeroImageWrapper>\n        <ContentWrap>\n          <Title noMargin={buttons.length === 0}>{title}</Title>\n          {buttons.length ? (\n            <ButtonWrapper>\n              {buttons.map(({ white = true, ...button }) =>\n                button.to ? (\n                  <HeroLinkButton to={button.to} key={button.id} whiteBackground={white}>\n                    <Label name={button.label} />\n                  </HeroLinkButton>\n                ) : (\n                  <HeroButton whiteBackground={white} key={button.id} onClick={button.onClick}>\n                    <Label name={button.label} />\n                  </HeroButton>\n                )\n              )}\n            </ButtonWrapper>\n          ) : null}\n        </ContentWrap>\n      </Container>\n      <BikeFilters fluid={fluid} viewHidden={viewHidden} isFamilyPage={isFamilyPage} isGenrePage={isGenrePage} />\n    </Outer>\n  </>\n);\n\nexport default Hero;\n","import React from 'react';\nimport styled from 'styled-components';\n\nexport const Wrap = styled.div`\n  margin: 30px 0;\n`;\n\nexport const Title = styled.h3``;\n\nexport const Description = styled.p``;\n","import React from 'react';\nimport Label from 'components/_utility/Label';\nimport { Wrap, Title, Description } from './NoResults.styled';\n\nconst NoResults = () => (\n  <Wrap>\n    <Title>\n      <Label name=\"noResultsTitle\"></Label>\n    </Title>\n    <Description>\n      <Label name=\"noResultsText\"></Label>\n    </Description>\n  </Wrap>\n);\n\nexport default NoResults;\n","import React from 'react';\nimport styled from 'styled-components';\nimport Link from 'components/_utility/Link/Link';\nimport RichText from 'components/_utility/RichText/RichText';\nimport { minBp } from 'src/lib/theme';\n\n// Stop styled-components passing primary prop into Link\nconst _Link = ({ primary, ...props }) => <Link {...props} />; // eslint-disable-line\n\nexport const Wrap = styled.div`\n  ${({ isListingsPage, listView }) => `\n    background-color: white;\n    box-shadow: 0 0 32px 0 rgba(0, 0, 0, 0.1);\n    width: 100%;\n    animation-name: fadeIn;\n    animation-duration: 0.5s;\n    animation-fill-mode: forwards;\n    will-change: opacity;\n    opacity: 0;\n    display: flex;\n    flex-direction: column;\n\n    @media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {\n      display: block;\n    }\n\n    @keyframes fadeIn {\n      from {\n        opacity: 0;\n      }\n\n      to {\n        opacity: 1;\n      }\n    }\n\n    ${\n      isListingsPage\n        ? `\n      @media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {\n        max-width: calc(25% - 32px);\n        margin: 0 16px 32px;\n\n        ${\n          listView\n            ? `      \n            max-width: 100%;\n            margin: 0 0 32px;\n            display: flex;\n        `\n            : ``\n        }\n      }\n\n    `\n        : ``\n    }\n\n    ${\n      listView\n        ? `\n      @media ${minBp('tabletLarge')} {\n        height: 215px;\n        margin-bottom: 32px;\n        flex-direction: row;\n      }\n    `\n        : ``\n    }\n  `}\n`;\n\nexport const ImageWrap = styled(_Link)`\n  ${({ listView }) => `\n    border-bottom: ${listView ? 'none' : '1px solid #e0e0e0'};\n    height: ${listView ? 'auto' : '150px'};\n    padding: 20px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    ${\n      listView\n        ? `\n      @media ${minBp('tabletLarge')} {\n        flex: 1;\n        border-right: 1px solid #e0e0e0;\n      }\n    `\n        : ``\n    }\n  `}\n`;\n\nexport const Image = styled.img`\n  display: block;\n  max-height: 110px;\n`;\n\nexport const Content = styled.div`\n  ${({ isListingsPage, listView }) => `  \n    padding: ${isListingsPage ? '35px 35px 30px' : '35px'};\n    height: ${isListingsPage ? 'auto' : '250px'};\n    overflow: hidden;\n    flex: 1;\n\n    @media ${minBp('tabletLarge')} {\n      height: 250px;\n    }\n\n    ${\n      listView\n        ? `\n      @media ${minBp('tabletLarge')} {\n        height: auto;\n        border-right: 1px solid #e0e0e0;\n        padding: 30px 50px;\n      }\n    `\n        : ``\n    }\n  `}\n`;\n\nexport const Name = styled.h4`\n  ${({ listView }) => `\n    text-transform: uppercase;\n    text-align: ${listView ? 'left' : 'center'};\n    margin-bottom: 10px;\n  `}\n`;\n\nexport const Price = styled.div`\n  ${({ listView }) => `\n    text-align: ${listView ? 'left' : 'center'};\n    font-weight: 500;\n    font-family: ${({ theme }) => theme.fonts.dinDemi};\n    color: black;\n    margin-bottom: 5px;\n  `}\n`;\n\nexport const Description = styled(RichText)`\n  ${({ isListingsPage }) => `  \n    font-size: 14px;\n    max-height: 92px;\n    display: ${isListingsPage ? 'none' : 'block'};\n\n    @media ${minBp('tabletLarge')} {\n      display: block;\n    }\n\n    ul {\n      margin: 0;\n      padding: 0;\n      padding-left: 16px;\n    }\n\n    li {\n      padding: 3px 0;\n    }\n  `}\n`;\n\nexport const Actions = styled.div`\n  border-top: 1px solid #e0e0e0;\n  padding: 10px 0;\n  display: flex;\n`;\n\nexport const Divider = styled.div`\n  width: 1px;\n  height: 43px;\n  background-color: #e0e0e0;\n`;\n\nexport const Action = styled(_Link)`\n  font-family: ${({ theme }) => theme.fonts.dinRegular};\n  height: 43px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-transform: uppercase;\n  flex: 1;\n  appearance: none;\n  color: black;\n  font-size: 15px;\n  background-color: white;\n  border: 0;\n  cursor: pointer;\n  text-decoration: none;\n  text-align: center;\n\n  ${({ primary, theme }) =>\n    primary\n      ? `\n    font-family: ${({ theme }) => theme.fonts.dinDemi};\n    color: ${theme.colors.buttons.primary};\n    font-weight: 500;\n  `\n      : ``}\n\n  &:focus {\n    background-color: #fafafa;\n  }\n`;\n\nexport const ActionLink = styled.a`\n  font-family: ${({ theme }) => theme.fonts.dinRegular};\n  height: 43px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-transform: uppercase;\n  flex: 1;\n  appearance: none;\n  color: black;\n  font-size: 15px;\n  background-color: white;\n  border: 0;\n  cursor: pointer;\n  text-decoration: none;\n  text-align: center;\n\n  ${({ primary, theme }) =>\n    primary\n      ? `\n    font-family: ${({ theme }) => theme.fonts.dinDemi};\n    color: ${theme.colors.buttons.primary};\n    font-weight: 500;\n  `\n      : ``}\n\n  &:focus {\n    background-color: #fafafa;\n  }\n`;\n\nexport const MainContent = styled.div`\n  ${({ listView }) => `\n    flex: 1;\n\n    ${\n      listView\n        ? `\n      @media ${minBp('tabletLarge')} {\n        display: flex;\n        flex: 2;\n      }\n    `\n        : ``\n    }\n  `}\n`;\n\nexport const AdditionalContent = styled.div`\n  ${({ listView }) => `\n    ${\n      listView\n        ? `\n      @media ${minBp('tabletLarge')} {\n        flex: 1;\n        display: flex;\n        flex-direction: column;\n      }\n    `\n        : ``\n    }\n  `}\n`;\n\nexport const DetailedDescription = styled.div`\n  ${({ listView }) => `\n    display: none;\n\n    ${\n      listView\n        ? `\n      @media ${minBp('tabletLarge')} {\n        display: block;\n        flex: 1;\n        padding: 30px 50px;\n        font-size: 14px;\n        line-height: 1.375;\n      }\n    `\n        : ``\n    }\n  `}\n`;\n","import React from 'react';\nimport Label from 'components/_utility/Label';\nimport { getImageBaseUrl } from 'helpers/request';\nimport fetchGoal from 'helpers/goals';\nimport { getGoalId } from 'src/redux/app/selectors';\nimport { useSelector } from 'react-redux';\n\nimport {\n  Wrap,\n  ImageWrap,\n  Image,\n  Content,\n  Name,\n  Price,\n  Description,\n  Actions,\n  Action,\n  ActionLink,\n  Divider,\n  MainContent,\n  AdditionalContent,\n  DetailedDescription,\n} from './BikeCard.styled';\n\nexport const BikeCard = ({\n  className,\n  bike: { id, name, thumbnail, priceLocalised, pricePrefixText, description, detailDescription, url },\n  family = false,\n  isListingsPage = false,\n  listView = false,\n  ...props\n}) => {\n  return (\n    <Wrap className={className} isListingsPage={isListingsPage} listView={listView} {...props}>\n      <MainContent listView={listView}>\n        <ImageWrap to={family ? `/bikes/family/${id}` : `/bike/${id}/configure`} listView={listView}>\n          {thumbnail ? <Image src={getImageBaseUrl() + thumbnail.src} alt={thumbnail.alt} /> : null}\n        </ImageWrap>\n        <Content isListingsPage={isListingsPage} listView={listView}>\n          <Name dangerouslySetInnerHTML={{ __html: name }} listView={listView} />\n          <Price listView={listView}>\n            {pricePrefixText || <Label name=\"fromLabel\" />} {priceLocalised}\n          </Price>\n          <Description dangerouslySetInnerHTML={{ __html: description }} isListingsPage={isListingsPage} />\n        </Content>\n      </MainContent>\n      <AdditionalContent listView={listView}>\n        <DetailedDescription\n          listView={listView}\n          dangerouslySetInnerHTML={{ __html: detailDescription }}\n        ></DetailedDescription>\n        <Actions>\n          <Action onClick to={family ? `/bikes/family/${id}` : `/bike/${id}/configure`} primary>\n            <Label name=\"configureLabel\" />\n          </Action>\n          <Divider />\n          <ActionLink href={url}>\n            <Label name=\"viewDetailsLabel\" />\n          </ActionLink>\n        </Actions>\n      </AdditionalContent>\n    </Wrap>\n  );\n};\n\nexport default BikeCard;\n","import React from 'react';\nimport styled from 'styled-components';\nimport _BikeCard from 'components/_cards/BikeCard/BikeCard';\nimport RichText from 'components/_utility/RichText/RichText';\nimport Button from '../Button/Button';\nimport { minBp } from '../../lib/theme';\n\nexport const Wrap = styled.div`\n  margin: 20px 0 0;\n  position: relative;\n\n  ${({ hasButton }) =>\n    hasButton\n      ? `\n    margin: 20px 0 60px;\n  `\n      : ``}\n\n  @media ${minBp('tabletLarge')} {\n    margin: 0 0 60px;\n  }\n`;\n\nexport const About = styled.div`\n  z-index: 2;\n  height: 100%;\n  width: 100%;\n  padding: 20px 30px 10px;\n\n  @media ${minBp('tabletLarge')} {\n    position: absolute;\n    height: 576px;\n    width: 460px;\n    padding: 70px 100px 0 100px;\n    background: white;\n    overflow: hidden;\n  }\n`;\n\nexport const Hairline = styled.div`\n  width: 1px;\n  background: #f1f1f1;\n  height: 504px;\n  position: absolute;\n  top: 20px;\n  right: 0;\n`;\n\nexport const Description = styled(RichText)`\n  line-height: 1.375;\n  display: none;\n\n  @media ${minBp('tabletLarge')} {\n    display: block;\n  }\n`;\n\nexport const Bikes = styled.div`\n  height: 544px;\n  margin-top: -20px;\n\n  @media ${minBp('tabletLarge')} {\n    margin-top: 0;\n  }\n\n  .ScrollbarsCustom {\n    position: relative;\n    width: 100%;\n    height: 100%;\n  }\n\n  .ScrollbarsCustom-Wrapper {\n    position: absolute;\n    top: 0px;\n    left: 0px;\n    bottom: 10px;\n    right: 0px;\n    overflow: hidden;\n  }\n\n  .ScrollbarsCustom-Scroller {\n    position: absolute;\n    top: 0px;\n    left: 0px;\n    bottom: 0px;\n    right: 0px;\n    overflow: scroll hidden;\n    margin-bottom: -15px;\n  }\n\n  .ScrollbarsCustom-Content {\n    box-sizing: border-box;\n    padding: 0.05px;\n    min-height: 100%;\n    min-width: 100%;\n  }\n\n  .ScrollbarsCustom-Track.ScrollbarsCustom-TrackX {\n    position: absolute;\n    overflow: hidden;\n    border-radius: 4px;\n    background: #dddddd;\n    user-select: none;\n    height: 10px;\n    bottom: 20px;\n    left: 30px;\n    width: calc(100% - 60px);\n\n    @media ${minBp('tabletLarge')} {\n      width: calc(100% - 532px);\n      bottom: 0px;\n      left: 498px;\n    }\n  }\n\n  .ScrollbarsCustom-Thumb.ScrollbarsCustom-ThumbX {\n    touch-action: none;\n    cursor: pointer;\n    border-radius: 4px;\n    background: #585a5f;\n    height: 100%;\n    width: 1245.69px;\n    transform: translateX(0px);\n  }\n`;\n\nexport const BikeScroller = styled.div`\n  ${({ cardCount = 0 }) => `\n    display: -ms-grid;\n    display: grid;\n    padding: 30px 30px 20px;\n    grid-gap: 32px;\n    grid-auto-flow: column;\n    grid-auto-rows: 464px;\n    grid-auto-columns: 259px;\n    -ms-grid-columns: (259px)[${cardCount}];\n\n    @media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {\n      display: flex;\n    }\n\n    @media ${minBp('additional.mobile')} {\n      grid-auto-columns: 271px;\n      -ms-grid-columns: (271px)[${cardCount}];\n    }\n\n    @media ${minBp('tabletLarge')} {\n      padding: 40px 40px 0 40px;\n      padding-left: 500px;\n    }\n  `}\n`;\n\nexport const Gutter = styled.div`\n  width: 1px;\n`;\n\nexport const BikeCard = styled(_BikeCard)`\n  @media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {\n    min-width: 271px;\n    width: 271px;\n    max-width: 271px;\n    margin-right: 32px;\n  }\n`;\n\nexport const ViewButton = styled(Button)`\n  margin-top: 15px;\n  background-color: ${({ theme }) => theme.colors.buttons.default};\n  color: white;\n  font-family: ${({ theme }) => theme.fonts.dinDemi};\n  font-size: 17px;\n  font-weight: 500;\n  text-transform: uppercase;\n  text-decoration: none;\n  position: absolute;\n  bottom: 0px;\n  z-index: 1;\n\n  @media ${minBp('tabletLarge')} {\n    position: static;\n    bottom: auto;\n  }\n\n  ${({ variant, theme }) => {\n    if (variant === 'btn--style-y') {\n      return `\n        background-color: ${theme.colors.buttons.racingYellow};\n        color: black;\n        \n        &:hover:not(:disabled) {\n          background-color: ${theme.colors.buttons.racingYellowDark};\n          border-color: ${theme.colors.buttons.racingYellow};\n          outline-color: ${theme.colors.buttons.racingYellowDark};\n          color: black;\n        }\n        \n        &:focus {\n          background-color: ${theme.colors.buttons.racingYellow};\n          border-color: ${theme.colors.buttons.racingYellowDark};\n          color: white;\n        }\n      `;\n    }\n  }}\n`;\n\nexport const Title = styled.h3`\n  text-transform: uppercase;\n  font-size: 24px;\n  font-family: ${({ theme }) => theme.fonts.dinDemi};\n  font-weight: 500;\n  margin-bottom: 7px;\n\n  @media ${minBp('tabletLarge')} {\n    font-size: 35px;\n    margin-bottom: 15px;\n  }\n`;\n","import React, { useRef } from 'react';\nimport Scrollbar from 'react-scrollbars-custom';\nimport Label from 'components/_utility/Label';\nimport { useSelector, useDispatch } from 'react-redux';\nimport { getFeatureCards } from 'src/redux/bikes/selectors';\nimport { setFeatureCards } from 'src/redux/bikes/actions';\nimport { useNavigate } from 'helpers/routing';\nimport {\n  Wrap,\n  About,\n  Description,\n  ViewButton,\n  Bikes,\n  BikeScroller,\n  BikeCard,\n  Title,\n  Gutter,\n  Hairline,\n} from './FeatureBlock.styled';\n\nconst FeatureBlock = ({ id, title, description, familyCards = true, ctaColour }) => {\n  const navigate = useNavigate();\n  const dispatch = useDispatch();\n  const features = useSelector(getFeatureCards(familyCards ? 'genre' : 'family'));\n  const cards = features[id];\n  const buttonRef = useRef();\n  let scrollerRef;\n\n  if (!cards || !cards.length) {\n    return null;\n  }\n\n  return (\n    <Wrap hasButton={familyCards}>\n      <About>\n        <Title>{title}</Title>\n        <Description\n          dangerouslySetInnerHTML={{\n            __html: description,\n          }}\n        />\n        {familyCards ? (\n          <ViewButton\n            variant={ctaColour}\n            ref={buttonRef}\n            onClick={() => {\n              navigate(`/families/${id}`);\n            }}\n          >\n            <Label name=\"viewCollectionButton\" />\n          </ViewButton>\n        ) : null}\n        <Hairline />\n      </About>\n      <Bikes>\n        <Scrollbar\n          noDefaultStyles\n          renderer={({ elementRef: _scrollerRef, ...props }) => (\n            <div\n              ref={ref => {\n                scrollerRef = ref;\n                return _scrollerRef(ref);\n              }}\n              {...props}\n            ></div>\n          )}\n          onUpdate={() => {\n            if (scrollerRef.classList.contains('trackXVisible') && !scrollerRef.classList.contains('trackMounted')) {\n              scrollerRef.classList.add('trackMounted');\n\n              if (buttonRef.current) {\n                buttonRef.current.style.bottom = '-40px';\n              }\n            }\n          }}\n        >\n          <BikeScroller cardCount={cards.length}>\n            {cards.map(card => (\n              <BikeCard key={card.id} bike={card} family={familyCards} />\n            ))}\n            {cards.length > 1 ? <Gutter></Gutter> : null}\n          </BikeScroller>\n        </Scrollbar>\n      </Bikes>\n    </Wrap>\n  );\n};\n\nexport default FeatureBlock;\n"],"sourceRoot":""}