![\"\"](\"/static/images/icons/google-greyscale-short.svg\"){kind=icon}
\n \n );\n};\n","import { useEffect, useRef } from 'react';\n\nexport const useEventListener = (eventName, handler, element) => {\n // Create a ref that stores handler\n const savedHandler = useRef();\n // Update ref.current value if handler changes.\n // This allows our effect below to always get latest handler ...\n // ... without us needing to pass it in effect deps array ...\n // ... and potentially cause effect to re-run every render.\n useEffect(() => {\n savedHandler.current = handler;\n }, [handler]);\n\n useEffect(\n () => {\n const elem = element || window;\n // Make sure element supports addEventListener\n // On\n const isSupported = elem && elem.addEventListener;\n if (!isSupported) return;\n // Create event listener that calls handler function stored in ref\n const eventListener = (event) => savedHandler.current(event);\n // Add event listener\n elem.addEventListener(eventName, eventListener);\n // Remove event listener on cleanup\n return () => {\n elem.removeEventListener(eventName, eventListener);\n };\n },\n [eventName, element] // Re-run if eventName or element changes\n );\n};\n","import React from 'react';\nimport { DesktopAd, TabletAd, MobileAd } from './ads/search-results-ads';\nimport useIsMobile from 'tradera/hooks/use-is-mobile';\nimport { useIsTablet } from 'tradera/hooks/use-is-tablet';\nimport useIsDesktop from 'tradera/hooks/use-is-desktop';\nimport { useIsSiteWidthFull } from 'tradera/state/ui/helpers';\nimport { ITEM_LAYOUT } from 'tradera/constants/ui';\n\nconst MOBILE_AD_OFFSET = 6;\nconst AD_FREQUENCY = 12;\nconst AD_FREQUENCY_FULL_WIDTH = 16;\n\nfunction getItemsPerRow(\n itemLayout: ITEM_LAYOUT | undefined,\n isSiteWidthFull: boolean\n) {\n const factor = isSiteWidthFull ? 2 : 1;\n switch (itemLayout) {\n case ITEM_LAYOUT.LIST:\n // siteWidthFull does not add items per row in list view.\n return 1;\n case ITEM_LAYOUT.GRID_LARGE:\n return 2 * factor;\n case ITEM_LAYOUT.GRID_MEDIUM:\n return 3 * factor;\n case ITEM_LAYOUT.GRID:\n default:\n return 4 * factor;\n }\n}\ntype ComponentsWithStitchAdsProps = {\n adsEnabled: boolean;\n components: React.ReactNode[];\n itemLayout?: ITEM_LAYOUT;\n pageIndex: number;\n wrapper?: (props: { children: React.ReactNode }) => JSX.Element;\n};\nexport const ComponentsWithStitchAds = ({\n adsEnabled,\n components,\n itemLayout,\n pageIndex,\n wrapper: wrapperProp\n}: ComponentsWithStitchAdsProps) => {\n const result = [];\n let mobileAdIndex = 0;\n let tabletAdIndex = 0;\n let desktopAdIndex = 0;\n const defaultWrapper = ({ children }: { children: React.ReactNode }) => (\n {children}
\n );\n const Wrapper = wrapperProp ?? defaultWrapper;\n\n const isSiteWidthFull = useIsSiteWidthFull();\n const isMobile = useIsMobile();\n const isTablet = useIsTablet();\n const isDesktop = useIsDesktop();\n\n if (!(components && components.length > 0)) {\n return null;\n }\n\n const adFrequency = isSiteWidthFull\n ? AD_FREQUENCY_FULL_WIDTH\n : AD_FREQUENCY;\n\n const itemsPerRow = getItemsPerRow(itemLayout, isSiteWidthFull);\n\n const adOffset = isMobile ? MOBILE_AD_OFFSET : itemsPerRow * 2;\n const adClassName = itemLayout === ITEM_LAYOUT.LIST ? 'mb-2' : '';\n for (const [index, component] of components.entries()) {\n if (adsEnabled && pageIndex > 0 && index > 0) {\n if ((index - adOffset) % adFrequency === 0) {\n if (isMobile) {\n result.push(\n \n {\n if (onClick != null) onClick();\n handleClick();\n }}\n icon={
\n );\n};\n\nScrollToTopButton.propTypes = {\n onClick: PropTypes.func\n};\n\nexport default ScrollToTopButton;\n","export default \"//static.tradera.net/touchweb/static/output/images/multicolor.45085a87.svg\";","import * as React from 'react';\nimport cx from 'classnames';\nimport PropTypes from 'prop-types';\nimport ALink from 'tradera/components/alink/alink';\nimport { useUrlLocalizer } from 'tradera/lang/translate';\nimport { Button } from '../atoms/button/button';\n\ntype Category = { id: number; name: string; url: string };\ntype CategoryTree = Category & {\n status: string;\n children: CategoryTree[];\n};\ntype BreadCrumbsProps = {\n categoryPath?: Category[];\n categoryTree?: CategoryTree;\n className?: string;\n handleClick?: (category: Category) => void;\n inSPA?: boolean;\n};\n/**\n * Creates a breadcrumb itemd with Microdata attributes.\n * Microdata can be tested with Google's Structured Data Testing Tool here:\n * https://search.google.com/structured-data/testing-tool?utm_campaign=devsite&utm_medium=microdata&utm_source=breadcrumb\n * Please note that it will give errors if href is contains localhost:5454.\n */\nexport const Breadcrumbs = ({\n categoryPath,\n categoryTree,\n className,\n handleClick,\n inSPA = false\n}: BreadCrumbsProps) => {\n const breadcrumbRef = React.useRef\n {!isNextJs &&
\n );\n }\n}\n\nconst withoutRouter = (ComposedComponent) =>\n function WithoutRouter({ ...props }) {\n const location = useLocation();\n return \n {title && (\n
\n);\n\nAccordion.propTypes = {\n children: PropTypes.node.isRequired,\n title: PropTypes.string\n};\n","// extracted by mini-css-extract-plugin\nexport default {\"item-body\":\"item-body--8aZkT\",\"itemBody\":\"item-body--8aZkT\",\"collapsed\":\"collapsed--YrdvD\",\"arrow-open\":\"arrow-open--kaW1Q\",\"arrowOpen\":\"arrow-open--kaW1Q\",\"nextLevel\":\"nextLevel--krwk2\",\"slideIn\":\"slideIn--juTqr\",\"slideOut\":\"slideOut--4bDyM\"};","// extracted by mini-css-extract-plugin\nexport default {\"nextLevel\":\"nextLevel--rjQPP\",\"slideIn\":\"slideIn--vdkdH\",\"body\":\"body--va3b0\",\"slideOut\":\"slideOut--CmW-5\"};","import React, { useState } from 'react';\nimport IconBack from '@tradera/blueprint/theme/icons2/back.svg?jsx';\nimport { Button } from 'tradera/components/atoms/button/button';\nimport styles from './accordion-next-level.module.scss';\nimport { HeaderWithCloseButton } from 'tradera/components/scrollable-modal/header-with-close-button';\nimport cn from 'classnames';\n\ntype AccordionNextLevelProps = {\n children: React.ReactNode;\n onClose?: () => void;\n onDismiss: () => void;\n title?: string;\n};\n\nexport const AccordionNextLevel = ({\n onClose,\n onDismiss,\n children,\n title\n}: AccordionNextLevelProps) => {\n const [slideOut, setSlideOut] = useState(false);\n\n const closeNextLevel = () => {\n setSlideOut(true);\n setTimeout(() => {\n setSlideOut(false);\n onDismiss();\n }, 400);\n };\n\n return (\n \n {title}\n
\n )}\n {children}\n {children}
\n \n );\n};\n","import React, { useState } from 'react';\nimport ArrowDown from '@tradera/blueprint/theme/icons2/arrow-down.svg?jsx';\nimport ArrowRight from '@tradera/blueprint/theme/icons2/arrow-right.svg?jsx';\nimport { Button } from 'tradera/components/atoms/button/button';\nimport styles from './accordion-item.module.scss';\nimport cn from 'classnames';\nimport { AccordionNextLevel } from './accordion-next-level';\n\ntype AccordionItemProps = {\n hasNextLevel?: boolean;\n children: React.ReactNode;\n className?: string;\n collapsable?: boolean;\n hideTitle?: boolean;\n onChange?: (open: boolean) => void;\n title?: string;\n label?: React.ReactNode;\n onDismiss?: () => void;\n};\n\nexport const AccordionItem = ({\n className = '',\n collapsable = true,\n hideTitle = false,\n label,\n onChange,\n children,\n title,\n hasNextLevel,\n onDismiss\n}: AccordionItemProps) => {\n const [accordionOpen, setAccordionOpen] = useState(false);\n\n return (\n <>\n \n {hideTitle ? (\n {\n setAccordionOpen(!accordionOpen);\n onChange?.(!accordionOpen);\n }\n : () => {}\n }>\n \n {title}\n \n {label && !accordionOpen && (\n \n {label}\n \n )}\n \n {collapsable && (\n \n {hasNextLevel ? (\n \n )}\n \n \n {accordionOpen && (\n <>\n {hasNextLevel ? (\n \n setAccordionOpen(false)\n }\n onClose={onDismiss}\n title={title}>\n {children}\n \n ) : (\n \n
\n )}\n \n )}\n \n )}\n \n \n );\n};\n","import React, { useCallback } from 'react';\nimport PropTypes from 'prop-types';\nimport PAGE_TYPES from 'tradera/constants/page-types';\nimport {\n stripPaginationFromQueryParameters,\n toSearchString\n} from 'tradera/utils/url';\nimport { useTranslator } from 'tradera/lang/translate';\nimport { TreeNavigation } from 'tradera/components/tree-navigation/tree-navigation';\n\nconst mapTree = (tree, searchString) =>\n tree.map((category) => ({\n ...category,\n isActive: category.status === 'active',\n url: searchString ? `${category.url}${searchString}` : category.url,\n children:\n category.children?.length > 0\n ? mapTree(category.children, searchString)\n : category.children\n }));\n\nexport const FilterCategories = ({\n filterCategories,\n handleCategoryChange,\n handleSearchCategoryChange,\n pageType,\n queryParams\n}) => {\n const { t } = useTranslator();\n const categoryResultPage = pageType === PAGE_TYPES.CATEGORY_RESULT_PAGE;\n const onCategoryClick = useCallback(\n (category, event) => {\n if (categoryResultPage) {\n handleCategoryChange(category, event);\n } else {\n event.preventDefault();\n handleSearchCategoryChange(category);\n }\n },\n [categoryResultPage, handleCategoryChange, handleSearchCategoryChange]\n );\n\n if (!filterCategories?.categoryTree) {\n return null;\n }\n\n const categories = [filterCategories?.categoryTree];\n\n const searchString = categoryResultPage\n ? toSearchString(stripPaginationFromQueryParameters(queryParams))\n : null;\n const tree = mapTree(categories, searchString);\n\n const isAllCategoriesActiveParent =\n pageType === PAGE_TYPES.SEARCH_RESULT_PAGE && !queryParams?.categoryId;\n\n return (\n {children}
\n ) : (\n <>\n \n {children}\n
\n \n
\n );\n};\n\nFilterCategories.propTypes = {\n filterCategories: PropTypes.shape({\n categoryTree: PropTypes.object,\n parameter: PropTypes.string,\n type: PropTypes.string\n }).isRequired,\n handleCategoryChange: PropTypes.func,\n handleSearchCategoryChange: PropTypes.func,\n pageType: PropTypes.string.isRequired,\n queryParams: PropTypes.object.isRequired\n};\n","import React from 'react';\nimport LoadingIcon from '@tradera/blueprint/theme/icons2/loading.svg?jsx';\nimport { Accordion } from 'tradera/components/accordion/accordion';\nimport { AccordionItem } from 'tradera/components/accordion/accordion-item';\nimport { FilterCategories } from './filter-categories';\nimport { BottomSheet } from 'tradera/components/bottom-sheet/bottom-sheet';\nimport { useTranslator } from 'tradera/lang/translate';\nimport { Button } from 'tradera/components/atoms/button/button';\nimport { HeaderWithCloseButton } from 'tradera/components/scrollable-modal/header-with-close-button';\nimport useIsMobile from 'tradera/hooks/use-is-mobile';\nimport SideMenu from 'tradera/components/side-menu/side-menu';\n\ntype FilterCategoriesSideSheetProps = {\n filterCategories: {\n categoryTree: object;\n parameter: string;\n type: string;\n };\n handleCategoryChange: () => void;\n handleSearchCategoryChange: () => void;\n onDismiss: () => void;\n pageType: string;\n isLoading: boolean;\n show: boolean;\n queryParams: object;\n};\n\nexport const FilterCategoriesSideSheet = ({\n filterCategories,\n handleCategoryChange,\n handleSearchCategoryChange,\n pageType,\n isLoading,\n queryParams,\n onDismiss,\n show\n}: FilterCategoriesSideSheetProps) => {\n const { t } = useTranslator();\n const isMobile = useIsMobile();\n\n const body = (\n \n
\n );\n\n return isMobile ? (\n \n {isLoading && (\n \n \n \n
\n \n
\n )}\n \n \n
\n \n {\n e.preventDefault();\n handleInternalSearch(searchString);\n }}>\n setSearchString(e.target.value)}\n />\n \n
\n );\n};\n\nexport default InternalSearchForm;\n","type Props = {\n html: string;\n className?: string;\n};\n\nexport const IntroTextContainer = ({ html, className, ...props }: Props) => (\n \n \n {isFetching ? (\n \n
\n ) : (\n \n closeItemSettings()}\n />\n
\n Verktyg för din Traderabutik
\n\n
\n {canHaveDiscount && (\n \n
\n \n {\n this.handleOnDislayClick();\n }}\n />\n \n {onDisplayDisabled ? (\n \n {`Max antal utvalda object uppnått (${maxOnDisplayCount})`}\n \n ) : (\n `Flytta produkten längst upp i listan (${\n maxOnDisplayCount -\n onDisplayCount\n } av ${maxOnDisplayCount}\n kvar)`\n )}\n \n
\n \n
\n \n )}\n \n
\n \n \n {`(${\n maxDiscountCount -\n discountCount\n } av ${maxDiscountCount} kvar)`}\n
\n \n Vill du lägga till rabatt\n för denna produkt?\n
\n\n \n
\n \n \n {price} kr\n \n
\n \n {hasDiscount\n ? 'Rabatterat pris'\n : 'Nuvarande pris'}\n
\n \n
\n \n closeItemSettings()}>\n Avbryt\n \n \n this.saveItemSettings()\n }>\n Spara\n \n
\n \n {t('itemCard_nonSpecifiedShipping')}\n
\n );\n }\n\n const isPickupOnly =\n shippingOptions.length === 1 &&\n [\n ShippingOptionProvider.Takeaway,\n ShippingOptionProvider.TakeawayOnly\n ].includes(shippingOptions[0].type);\n\n if (isPickupOnly) {\n return (\n\n {t('itemCard_pickup')}\n
\n );\n }\n\n const shippingCost = shippingOptions[0].cost;\n\n if (shippingCost) {\n return (\n\n {t('itemCard_shippingCost', { shippingCost })}\n
\n );\n }\n\n return null;\n};\n","import React from 'react';\nimport ALink from 'tradera/components/alink/alink';\nimport { EndTimeLabel } from './item-card-parts/end-time-label';\nimport { AttributeButtonsList } from './item-card-parts/attribute-buttons-list';\nimport { BidsLabel } from './item-card-parts/bids-label';\nimport { DiscountBadge } from './item-card-parts/discount-badge';\nimport { DiscountedPriceLabel } from './item-card-parts/disacount-price-label';\nimport { ItemCardImage } from './item-card-parts/item-card-image';\nimport { NewTodayBadge } from './item-card-parts/new-today-badge';\nimport { OnDisplayBadge } from './item-card-parts/on-display-badge';\nimport { PriceLabel } from './item-card-parts/price-label';\nimport { QuickViewButton } from './item-card-parts/quick-view-button';\nimport { SellerLink } from './item-card-parts/seller-link';\nimport { SettingsButton } from './item-card-parts/settings-button';\nimport { ShippingLabel } from './item-card-parts/shipping-label';\nimport { WishListButton } from './item-card-parts/wish-list-button';\nimport { useSelector } from 'react-redux';\nimport { selectIsSwedishVisitor } from 'tradera/state/shipping-region/selectors';\nimport { useDayJs } from 'tradera/hooks/use-day-js';\nimport { useAppSelector } from 'tradera/state/hooks';\nimport { useTranslator } from 'tradera/lang/translate';\nimport type {\n Attribute,\n ItemDto\n} from 'tradera/state/services/types/touchweb-search-api.types';\nimport { AuctionType } from 'tradera/state/services/types/touchweb-search-api.types';\nimport { getVisibleAttributes } from './item-card-parts/attribute-list-helper';\n\ntype ItemListCardProps = {\n item?: ItemDto;\n onAddToWishlist?: (itemId: ItemDto['itemId']) => void;\n onRemoveFromWishlist?: (itemId: ItemDto['itemId']) => void;\n onQuickView?: (item: ItemDto) => void;\n onSettings: (item: ItemDto) => void;\n onAttributeButtonClick: (attr: Attribute | null) => void;\n isShopOwnedByCurrentMember: boolean;\n onClick: (e: React.MouseEvent{getBadge()}
\n \n {!!item?.attributes?.length && onAttributeButtonClick && (\n
\n \n \n
\n
\n \n \n {item?.shortDescription}\n \n
\n \n \n
\n
\n \n \n {item?.shortDescription}\n \n
\n \n
\n\n \n
\n \n {t('item-card_text_or')}{' '}\n {showBuyNowText && (\n \n {t('itemCard_buyNow')}\n \n )}{' '}\n {showBuyNowPrice && (\n
{t('itemCard_buyNow')}
\n )}\n {isSwedishVisitor && (\n\n {!isShopItem && (\n
\n {t('searchResults_zeroResults_title')}\n
\n\n
\n \n );\n};\n\nexport default React.memo(ZeroResults);\n","// extracted by mini-css-extract-plugin\nexport default {\"grid\":\"grid--wjGlP\",\"list\":\"list--o0q1c\",\"cards-xs\":\"cards-xs--gSome\",\"cardsXs\":\"cards-xs--gSome\",\"cards-sm\":\"cards-sm--ONg5C\",\"cardsSm\":\"cards-sm--ONg5C\",\"cards-md\":\"cards-md--qZo8e\",\"cardsMd\":\"cards-md--qZo8e\",\"cards-lg\":\"cards-lg--yvE9x\",\"cardsLg\":\"cards-lg--yvE9x\",\"cards-xl\":\"cards-xl--JNgoM\",\"cardsXl\":\"cards-xl--JNgoM\",\"span-entire-row\":\"span-entire-row--t6Stz\",\"spanEntireRow\":\"span-entire-row--t6Stz\"};","import React, { useContext } from 'react';\nimport classnames from 'classnames';\nimport css from './item-card-grid.module.scss';\n\nconst ItemCardGridContext = React.createContext(null);\nconst useItemCardGridContext = () => {\n const context = useContext(ItemCardGridContext);\n\n if (!context) {\n throw new Error(\n 'Component cannot be used outside of ItemCardGridContext'\n );\n }\n return context;\n};\n\nexport const ItemCardGrid = (props) => {\n const { itemSize, renderAsList, children, className, ...rest } = props;\n return (\n \n {t('searchResults_zeroResults_hint')}\n
\n- \n
- {t('searchResults_zeroResults_bullets_1')} \n
- {t('searchResults_zeroResults_bullets_2')} \n
- {t('searchResults_zeroResults_bullets_3')} \n
- {t('searchResults_zeroResults_bullets_4')} \n
\n {fallbackItemsHeaderTitle}\n
\n \n );\n return (\n <>\n {showSavedSearchBanner && (\n\n {t('searchResults_fallback_saveSearch_title')}\n
\n\n {t('searchResults_fallback_saveSearch_text')}\n
\n\n {fallbackItemsHeaderDescription}\n
\n )}\n\n {t('searchResults_selected_items')}\n
\n \n \n\n
\n \n
\n );\n};\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport Slider from 'rc-slider';\nimport { withTranslator } from 'tradera/lang/translate';\nimport * as gtm from 'tradera/apps/tradera/components/discover/helpers/search-gtm';\n\n// TOOD: Rename component to \"range\"? To avoid confusion with the price-slider container\n\nclass PriceRange extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n //set starting position for handle\n usedSlider: false,\n min: props.handleStart || props.rangeStart,\n max: props.handleEnd || props.rangeEnd,\n loading: false,\n lastSearchMin: props.handleStart,\n lastSearchMax: props.handleEnd\n };\n this.formElement = null;\n }\n\n setFormReference = (el) => {\n this.formElement = el;\n };\n\n /**\n * @description Handles min value changing in price slider\n * @param {object} event syntehtic event contains value `event.target.value`\n * @memberof PriceRange\n */\n handleMinChange = (event) => {\n this.setMin(event.target.value);\n };\n\n setMin = (value) => {\n const { rangeStart } = this.props;\n let min = value;\n if (min === '' || isNaN(min)) {\n min = min === '' ? rangeStart : this.state.min;\n } else {\n min = parseInt(min, 10);\n }\n this.setState({\n min\n });\n return min;\n };\n\n /**\n * @description Handles max value changing in price slider\n * @param {object} event syntehtic event contains value `event.target.value`\n * @memberof PriceRange\n */\n handleMaxChange = (event) => {\n const max = this.setMax(event.target.value);\n if (max >= this.props.rangeEnd) {\n event.currentTarget.blur();\n }\n };\n\n setMax = (value) => {\n const { rangeEnd } = this.props;\n let max = value;\n if (max === '' || isNaN(max)) {\n max = max === '' ? rangeEnd : this.state.max;\n } else {\n max = parseInt(max, 10);\n }\n max = Math.min(max, this.props.rangeEnd);\n this.setState({\n max\n });\n return max;\n };\n\n stateHasChangedSinceStart = (inputMinValue, inputMaxValue) => {\n return (\n inputMinValue !== this.state.lastSearchMin ||\n inputMaxValue !== this.state.lastSearchMax\n );\n };\n\n gotoNewURL = (fromPrice, toPrice) => {\n const { handlePriceFilterChange } = this.props;\n\n // Get values from inputs if not provided as arguments\n if (!this.stateHasChangedSinceStart(fromPrice, toPrice)) {\n return;\n }\n\n const search = () => {\n if (handlePriceFilterChange) {\n // This will update the URL with the new price\n handlePriceFilterChange({\n fromPrice:\n fromPrice <= this.props.rangeStart ? null : fromPrice,\n toPrice: toPrice >= this.props.rangeEnd ? null : toPrice\n });\n gtm.trackPriceFilter(fromPrice, toPrice);\n this.setState({\n lastSearchMin: parseInt(fromPrice, 10),\n lastSearchMax: parseInt(toPrice, 10) || null,\n loading: false\n });\n }\n };\n\n this.setState({\n loading: true\n });\n setTimeout(search, 1); // Hack to make sure its called after the handleValuesChanging::setState\n };\n\n handleValuesChanging = ([min, max]) => {\n this.setMin(min);\n this.setMax(max);\n };\n\n inputMinLength = () => {\n return this.state.min.toString().length;\n };\n\n inputMaxLength = () => {\n return this.state.max.toString().length;\n };\n\n handleInputBlur = () => {\n if (this.props.handlePriceFilterChange) {\n this.gotoNewURL(this.state.min, this.state.max);\n }\n };\n\n handleSliderInteraction = ([min, max]) => {\n const { handleStart, handleEnd, handlePriceFilterChange } = this.props;\n if (handlePriceFilterChange) {\n // Check it values differ from what is currently set\n if (handleStart !== min || handleEnd !== max) {\n this.gotoNewURL(min, max);\n }\n }\n };\n\n componentDidUpdate(prevProps) {\n // Update min and max values when updated through props\n if (prevProps.handleStart !== this.props.handleStart) {\n this.setMin(this.props.handleStart);\n }\n if (prevProps.handleEnd !== this.props.handleEnd) {\n this.setMax(this.props.handleEnd);\n }\n }\n\n render() {\n const { rangeStart, rangeEnd, t } = this.props;\n const { min, max } = this.state;\n const isMax = max >= rangeEnd;\n const limitedMax = isMax ? rangeEnd : max;\n\n return (\n \n {\n e.preventDefault();\n handleProfileSearch(searchString);\n }}>\n setSearchString(e.target.value)}\n />\n \n
\n \n
\n \n );\n }\n}\n\nPriceRange.propTypes = {\n handleStart: PropTypes.number,\n handleEnd: PropTypes.number,\n handlePriceFilterChange: PropTypes.func,\n rangeStart: PropTypes.number.isRequired,\n rangeEnd: PropTypes.number.isRequired\n};\n\n// export default PriceRange;\nexport { PriceRange };\nexport default withTranslator(PriceRange);\n","// extracted by mini-css-extract-plugin\nexport default {\"filterOption\":\"filterOption--l4QLO\",\"body\":\"body--Cau7n\",\"inner\":\"inner--QdYTv\",\"open\":\"open--jvkWy\",\"icon\":\"icon--piQ7t\",\"arrowOpen\":\"arrowOpen---umoA\",\"button\":\"button--UQkxb\"};","import type { ReactChild, RefObject } from 'react';\nimport React, { useState, useRef, useCallback, useEffect } from 'react';\nimport { Button } from 'tradera/components/atoms/button/button';\nimport styles from './filter-options.module.scss';\nimport cn from 'classnames';\nimport { useClickOutside } from 'tradera/hooks/use-click-outside';\nimport { useEventListener } from 'tradera/hooks/use-event-listener';\nimport { useIsTablet } from 'tradera/hooks/use-is-tablet';\nimport useIsDesktop from 'tradera/hooks/use-is-desktop';\nimport { BottomSheet } from 'tradera/components/bottom-sheet/bottom-sheet';\nimport { HeaderWithCloseButton } from 'tradera/components/scrollable-modal/header-with-close-button';\nimport { useTranslator } from 'tradera/lang/translate';\nimport { setIsFilterOpen } from 'tradera/state/discover/reducer';\nimport { useAppDispatch } from 'tradera/state/hooks';\nimport { DropdownButton } from 'tradera/components/dropdown-button/dropdown-button';\n\ntype FilterDropDownProps = {\n exceptionRef?: RefObject\n
\n );\n};\n\ntype FilterOptionProps = {\n children: ReactChild;\n title: string;\n id: string;\n className?: string;\n};\n\nexport const FilterOption = ({\n children,\n title,\n id,\n className\n}: FilterOptionProps) => {\n const [filterOpen, setFilterOpen] = useState(false);\n const [isFilterOnTheEdge, setIsFilterOnTheEdge] = useState(false);\n const isTablet = useIsTablet();\n const isDesktop = useIsDesktop();\n const isLargeScreen = isTablet || isDesktop;\n const ref = useRef{children}
\n \n
\n );\n\n return (\n {children}
\n \n \n
\n \n \n {title}\n \n \n {bottomSheetBody}\n \n {filterOpen && (\n <>\n {isLargeScreen && (\n \n \n {children}\n \n
\n )}\n \n )}\n \n );\n};\n","import React from 'react';\nimport type { ButtonProps } from 'tradera/components/atoms/button/button';\nimport { Button } from 'tradera/components/atoms/button/button';\nimport classNames from 'classnames';\n\nexport type AttributeButtonProps = Pick<\n ButtonProps,\n 'className' | 'onClick'\n> & {\n text: string;\n selected?: boolean;\n};\n\nexport const AttributeButton = ({\n className,\n text,\n selected,\n onClick\n}: AttributeButtonProps) => {\n return (\n \n
\n )}\n \n {optionWithText.text}\n \n );\n};\n\nexport default AttributeColor;\n","// extracted by mini-css-extract-plugin\nexport default {\"list\":\"list--Mv7rj\",\"isInSideSheet\":\"isInSideSheet--Dpbzm\"};","import React, { useState } from 'react';\nimport SearchIcon from '@tradera/blueprint/theme/icons2/search.svg?jsx';\nimport { useTranslator } from 'tradera/lang/translate';\nimport CloseIcon from '@tradera/blueprint/theme/icons2/close.svg?jsx';\nimport { addTextAndReSort } from 'tradera/components/attributes/attribute-helper';\nimport { Button } from 'tradera/components/atoms/button/button';\nimport cn from 'classnames';\nimport css from './all-attributes-list.module.scss';\n\nexport const AllAttributesList = ({\n options,\n defaultSelected,\n parameter,\n onSelect,\n translateOptions,\n isInSideSheet\n}) => {\n const { t } = useTranslator();\n const [search, setSearch] = useState('');\n const [selectedAttribute, setSelectedAttribute] = useState(defaultSelected);\n\n const optionsWithText = addTextAndReSort(\n parameter,\n t,\n translateOptions,\n options\n );\n\n const handleSelect = (attribute) => {\n if (selectedAttribute.includes(attribute)) {\n setSelectedAttribute(\n selectedAttribute.filter((selected) => selected !== attribute)\n );\n } else {\n setSelectedAttribute([...selectedAttribute, attribute]);\n }\n\n onSelect(attribute);\n };\n\n const handleInputChange = (input) => setSearch(input.substr(0, 10));\n\n const filteredAttributes = optionsWithText.filter((option) => {\n return option.value.toLowerCase().includes(search.toLowerCase());\n });\n\n return (\n <>\n \n
\n {filteredAttributes.length > 0 && (\n \n handleInputChange(e.target.value)}\n />\n {search ? (\n {\n setSearch('');\n }}>\n
\n \n {hasMoreOptions && presentation !== 'color' ? (\n {\n handleAttributeFilterChange(parameter, attributes);\n }}\n parameter={parameter}\n isInSideSheet={isInSideSheet}\n />\n ) : (\n
\n );\n};\n\nconst AttributeOptionsShortList = ({\n options,\n parameter,\n presentation,\n selectedValues,\n translateOptions,\n handleAttributeFilterChange,\n preserveOptionsOrder\n}) => {\n const { t } = useTranslator();\n\n const optionsWithText = preserveOptionsOrder\n ? addText(parameter, t, translateOptions, options)\n : addTextAndReSort(parameter, t, translateOptions, options);\n return optionsWithText.map((optionWithText, index) => {\n const selected = selectedValues.includes(optionWithText.value);\n if (presentation === 'color') {\n return (\n \n {options.map((option) => (\n \n {option.name}\n \n ))}\n
\n );\n};\n","import React from 'react';\nimport { RadioInputGroup } from 'tradera/components/form-controls/radio-input-group';\nimport type { Filter } from './types';\n\ntype FilterRadiosProps = {\n filter: Filter;\n handleFilterChange: (parameter: string, id: string) => void;\n id: string;\n};\nexport const FilterRadios = ({\n filter,\n handleFilterChange,\n id\n}: FilterRadiosProps) => {\n const { parameter, selectedValue, options } = filter;\n if (!options) {\n return null;\n }\n\n return (\n \n {\n handleFilterChange(parameter, e);\n }}\n />\n
\n );\n};\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Select } from 'tradera/components/form-controls/select';\n\nexport const SelectFilter = ({\n filter = {},\n handleFilterChange,\n id,\n label,\n selectClassName\n}) => {\n const { parameter, selectedValue, options } = filter;\n if (!options) {\n return null;\n }\n\n return (\n \n
\n {selectedUI === 0 ? buyerRegionElements : countyElements}\n \n );\n return countyFilterEnabled ? combinedUI() : buyerRegionElements;\n};\n\nexport default FilterShipTo;\n","function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nimport React from \"react\";\nexport default (({\n styles = {},\n ...props\n}) => /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0 0 14 17\",\n xmlns: \"http://www.w3.org/2000/svg\"\n}, props), /*#__PURE__*/React.createElement(\"path\", {\n fillRule: \"evenodd\",\n clipRule: \"evenodd\",\n d: \"M2 .75c.28 0 .5.22.5.5v9h-1v-9c0-.28.22-.5.5-.5zm5 0c.28 0 .5.22.5.5v3h-1v-3c0-.28.22-.5.5-.5zm5 0c.28 0 .5.22.5.5v8h-1v-8c0-.28.22-.5.5-.5zm-5.5 15v-8.5h1v8.5a.5.5 0 11-1 0zm5 0v-3.5h1v3.5a.5.5 0 11-1 0zm-10 0v-2.5h1v2.5a.5.5 0 11-1 0z\"\n}), /*#__PURE__*/React.createElement(\"path\", {\n fillRule: \"evenodd\",\n clipRule: \"evenodd\",\n d: \"M3 11.75a1 1 0 10-2 0 1 1 0 002 0zm1 0a2 2 0 10-4 0 2 2 0 004 0zm4-6a1 1 0 10-2 0 1 1 0 002 0zm1 0a2 2 0 10-4 0 2 2 0 004 0zm4 5a1 1 0 10-2 0 1 1 0 002 0zm1 0a2 2 0 10-4 0 2 2 0 004 0z\"\n})));","// extracted by mini-css-extract-plugin\nexport default {\"wrapper\":\"wrapper--COLTB\"};","import React from 'react';\nimport { useSelector } from 'react-redux';\nimport PriceRange from './price-range/price-range';\nimport { FilterOption } from './filter-option';\nimport { AttributeFilter } from './attributes/attribute-filter';\nimport { FilterRadios } from './filter-radios';\nimport { useTranslator } from 'tradera/lang/translate';\nimport { getTranslatedAttributeName } from 'tradera/components/attributes/attribute-helper';\nimport FilterShipTo from './filter-ship-to';\nimport { useLocation } from 'tradera/hooks/use-location';\nimport type { CompressedSearchFilterProps } from './types';\nimport { Button } from 'tradera/components/atoms/button/button';\nimport FilterIcon from '@tradera/blueprint/theme/icons2/filters.svg?jsx';\nimport cn from 'classnames';\nimport styles from './search-filter.module.scss';\nimport CONSTANTS from '../../constants/constants';\nimport useIsDesktop from 'tradera/hooks/use-is-desktop';\nimport {\n selectItemConditionFilter,\n selectSellerTypeFilter,\n selectCountyFilter,\n selectItemTypeFilter,\n selectAllowedBuyerRegionsFilter,\n selectItemStatusFilter\n} from 'tradera/state/discover/selectors';\nimport { useIsTablet } from 'tradera/hooks/use-is-tablet';\n\nexport const SearchFilter = ({\n filterPrice = {\n fromPrice: { value: 1 },\n toPrice: { value: 5000 }\n },\n attributeFilters = [],\n handleFilterChange,\n handlePriceFilterChange,\n handleAttributeFilterChange,\n queryParams,\n handleModalClick\n}: CompressedSearchFilterProps) => {\n const { t } = useTranslator();\n const location = useLocation();\n const isDesktop = useIsDesktop();\n const isTablet = useIsTablet();\n const isLargeScreen = isDesktop || isTablet;\n\n const itemCondition = useSelector(selectItemConditionFilter);\n const sellerType = useSelector(selectSellerTypeFilter);\n const county = useSelector(selectCountyFilter);\n const itemType = useSelector(selectItemTypeFilter);\n const allowedBuyerRegions = useSelector(selectAllowedBuyerRegionsFilter);\n const itemStatus = useSelector(selectItemStatusFilter);\n const { fromPrice, toPrice } = filterPrice;\n\n return (\n \n \n handleModalClick?.(CONSTANTS.MODALS.FILTER_MODAL)\n }\n theme=\"tag\"\n size={isLargeScreen ? 'sm' : 'xs'}\n icon={\n handleModalClick?.(CONSTANTS.MODALS.CATEGORY_MODAL)\n }>\n {t('searchSelect_allCategoriesShortName')}\n \n )}\n {attributeFilters.map((attributeFilter) => (\n \n \n \n \n \n \n \n \n \n \n
\n );\n};\n","export const getTotalActiveFilterCount = (\n fromPrice,\n toPrice,\n attributeFilters,\n activeFilters\n) => {\n const getAttributeFilterCount = () =>\n attributeFilters?.reduce(\n (count, attributeFilter) =>\n count + attributeFilter.selectedValues.length,\n 0\n );\n\n const userSetPriceFilter = !!fromPrice?.value || !!toPrice?.value ? 1 : 0;\n const totalAttributeFilters = getAttributeFilterCount();\n const totalActiveFilters =\n activeFilters?.length + totalAttributeFilters + userSetPriceFilter;\n return totalActiveFilters;\n};\n","import React from 'react';\nimport CloseIcon from '@tradera/blueprint/theme/icons2/close.svg?jsx';\nimport { Button } from 'tradera/components/atoms/button/button';\n\ntype TagProps = {\n text?: string;\n onClick: () => void;\n};\n\nexport const Tag = ({ text, onClick }: TagProps) => {\n const iconSize = '0.65rem';\n return (\n \n {`${t('searchResults_activeFilters')}: `}\n
\n\n \n
\n \n );\n};\n","import { useCallback, useEffect, useState } from 'react';\n\nexport const useScrollDirection = ({\n startPositionRef,\n delayDirection,\n delayInPx\n}) => {\n const [scrollDirection, setScrollDirection] = useState(null);\n const [currentScrollPosition, setCurrentScrollPosition] = useState(0);\n const [isDelayed, setIsDelayed] = useState(false);\n\n const onScroll = useCallback(() => {\n if (window === undefined || document === undefined) {\n return;\n }\n\n if (\n startPositionRef &&\n startPositionRef?.current?.getBoundingClientRect().bottom >\n window.scrollY\n ) {\n // Wait until we've scrolled below our startPositionRef before deciding scroll direction.\n setCurrentScrollPosition(null);\n setScrollDirection(null);\n return;\n }\n\n const newPosition =\n window.scrollY ||\n document.body.scrollTop ||\n (document.documentElement && document.documentElement.scrollTop) ||\n 0;\n\n const direction = currentScrollPosition < newPosition ? 'DOWN' : 'UP';\n\n setScrollDirection(direction);\n setCurrentScrollPosition(newPosition);\n\n if (delayDirection && delayInPx) {\n if (direction !== delayDirection) {\n setIsDelayed(false);\n } else {\n // \"Delay\" scrolling direction with delayInPx, e.g don't fire an event directly when scrolling in delayDirection, wait X px to avoid the scrolling being too sensitive\n if (newPosition < currentScrollPosition - delayInPx) {\n setIsDelayed(true);\n }\n }\n }\n }, [currentScrollPosition, startPositionRef, delayDirection, delayInPx]);\n\n useEffect(() => {\n document.addEventListener('scroll', onScroll);\n return () => {\n document.removeEventListener('scroll', onScroll);\n };\n }, [onScroll]);\n\n return { scrollDirection, isDelayed };\n};\n","import React, { useEffect, useState } from 'react';\nimport { connect } from 'react-redux';\nimport PropTypes from 'prop-types';\nimport PAGE_TYPES from 'tradera/constants/page-types';\nimport * as gtm from 'tradera/apps/tradera/components/discover/helpers/search-gtm';\nimport { formatNumber } from 'packages/format';\nimport { withTranslator } from 'tradera/lang/translate';\nimport { ShowMore } from 'tradera/components/show-more/show-more';\nimport { Breadcrumbs } from 'tradera/components/breadcrumbs/breadcrumbs';\nimport {\n Breakpoint,\n BREAKPOINTS\n} from 'tradera/components/breakpoint/breakpoint';\nimport InternalSearchForm from '../../internal-search-form';\nimport { IntroTextContainer } from '../intro-text-container';\nimport { SaveSearchButton } from '../save-search/save-search-button';\nimport { ItemLayoutSwitch } from '../layout/item-layout-switch';\nimport SiteLayoutSwitch from '../layout/site-layout-switch';\nimport { Select } from 'tradera/components/form-controls/select';\nimport { SortingLink } from '../sort/sorting-link';\nimport CloseIcon from '@tradera/blueprint/theme/icons2/close.svg?jsx';\nimport { logger } from 'packages/logger';\nimport { TranslatedByGoogle } from 'tradera/components/translation/translated-by-google';\nimport { isSwedishOrUndefined } from 'tradera/localization/languagecode';\nimport { useCookieUtil } from 'tradera/hooks/use-cookie-util';\nimport { SHIP_TO_SWEDEN_DISCLAIMER_DISMISSED } from 'tradera/constants/cookies';\nimport useIsDesktop from 'tradera/hooks/use-is-desktop';\nimport { SearchFieldProfilePage } from './search-field-profile-page';\nimport { FilterSection } from '../layout/filter-section';\nimport cn from 'classnames';\n\nconst SearchResultsHeader = (props) => {\n const {\n handleFilterChange,\n handleInternalSearch,\n handleSearchCategoryChange,\n headerCategory,\n internalSearch,\n isLoggedIn,\n pageType,\n queryParams,\n handleAttributeFilterChange,\n handlePriceFilterChange,\n handleClearAllFilters,\n searchLanguages,\n searchResults,\n t,\n handleModalClick,\n filterPrice,\n attributeFilters,\n activeFilters,\n isFilterOpen,\n isSearchFormOpen\n } = props;\n\n const { filters = {}, totalItems } = searchResults;\n const { sortBy } = filters;\n const { headerText } = headerCategory;\n const cookieUtil = useCookieUtil();\n const isDesktop = useIsDesktop();\n\n const showBreadcrumb = pageType === PAGE_TYPES.SEARCH_RESULT_PAGE;\n const showHeadingArea = pageType !== PAGE_TYPES.CUSTOM_RESULT_PAGE;\n const showHeading =\n isDesktop ||\n (!isDesktop && pageType === PAGE_TYPES.CATEGORY_RESULT_PAGE);\n const showIntroText = pageType === PAGE_TYPES.CATEGORY_RESULT_PAGE;\n\n useEffect(() => {\n if (sortBy === undefined) {\n // sortBy should not be undefined. Log this.\n logger(\n 'sortBy should not be undefined when rendering search-result-header'\n );\n }\n }, [sortBy]);\n\n const [shipToSwedenDisclaimerVisible, setShipToSwedenDisclaimerVisible] =\n useState(\n cookieUtil.readCookie(SHIP_TO_SWEDEN_DISCLAIMER_DISMISSED)\n ? false\n : true\n );\n\n const dismissShipToSwedenDisclaimer = () => {\n setShipToSwedenDisclaimerVisible(!shipToSwedenDisclaimerVisible);\n cookieUtil.createCookie(\n SHIP_TO_SWEDEN_DISCLAIMER_DISMISSED,\n !shipToSwedenDisclaimerVisible\n );\n };\n\n const allFilters = (\n \n
\n \n
\n \n \n {showBreadcrumb && (\n \n {pageType === PAGE_TYPES.CUSTOM_RESULT_PAGE &&\n !isDesktop && \n\n \n \n \n {!isDesktop && (\n <>\n {allFilters}\n
\n \n {isDesktop && allFilters}\n \n );\n};\n\nSearchResultsHeader.propTypes = {\n handleFilterChange: PropTypes.func.isRequired,\n headerCategory: PropTypes.object,\n isLoading: PropTypes.bool,\n pageType: PropTypes.string.isRequired,\n handleInternalSearch: PropTypes.func,\n handleSearchCategoryChange: PropTypes.func,\n handleAttributeFilterChange: PropTypes.func,\n handlePriceFilterChange: PropTypes.func,\n handleClearAllFilters: PropTypes.func,\n handleModalClick: PropTypes.func\n};\n\nconst ContentDescription = ({ introText }) => {\n return introText ? (\n \n
\n )}\n\n \n
\n )}\n \n {showHeadingArea && (\n <>\n
\n \n {showHeading && (\n \n {headerText}\n \n )}\n {isDesktop && (\n \n {totalItems\n ? t(\n 'searchResults_itemsFound',\n {\n itemsCount:\n formatNumber(\n totalItems\n ),\n count: totalItems\n }\n )\n : t(\n 'searchResults_noItemsFound'\n )}\n \n )}\n
\n {searchLanguages &&\n searchLanguages.some(\n (x) => !isSwedishOrUndefined(x)\n ) && (\n <>\n \n
\n {shipToSwedenDisclaimerVisible &&\n searchResults.filters\n ?.allowedBuyerRegions\n ?.selectedValue &&\n searchResults.filters.allowedBuyerRegions.selectedValue.includes(\n 'sweden'\n ) && (\n \n
\n )}\n \n )}\n {showIntroText && (\n \n \n {t(\n 'searchFilters_shipTo_sweden_disclaimer_header'\n )}\n \n \n
\n {t(\n isLoggedIn\n ? 'searchFilters_shipTo_sweden_disclaimer_text_logged_in'\n : 'searchFilters_shipTo_sweden_disclaimer_text_logged_out'\n )}\n \n
\n )}\n \n )}\n {pageType === PAGE_TYPES.CUSTOM_RESULT_PAGE &&\n isDesktop && \n
\n \n {[\n PAGE_TYPES.SEARCH_RESULT_PAGE,\n PAGE_TYPES.CATEGORY_RESULT_PAGE\n ].includes(pageType) && (\n {\n gtm.trackFilter(\n sortBy?.parameter,\n value\n );\n handleFilterChange(\n sortBy?.parameter,\n value\n );\n }}\n className=\"d-flex mr-2\"\n selectClassName=\"form-control-sm\"\n visuallyHideLabel\n type=\"sort\"\n />\n
\n \n
\n )}\n \n
\n \n
\n \n \n {totalItems\n ? t('searchResults_itemsFound', {\n itemsCount:\n formatNumber(totalItems),\n count: totalItems\n })\n : t('searchResults_noItemsFound')}\n \n
\n \n )}\n \n \n {t('searchResults_clear')}\n \n }\n />\n
\n );\n\n return isMobile ? (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n \n {t('searchFilters_itemsFound', {\n itemsCount: formatNumber(totalItems),\n count: totalItems\n })}\n
\n {isLoading && (\n\n
\n )}\n \n \n {t('searchFilters_layout')}\n \n
\n \n \n
\n \n {internalSearch && internalSearch.showSearchBar && (\n
\n );\n\n const heroContent = (\n \n \n
\n )}\n \n
\n );\n\n const mainContent = (\n \n \n \n )}\n
\n );\n\n return (\n <>\n {!isDesktop && (\n <>\n \n {\n handleOnChange(e.target.value, e);\n }}\n {...props}\n />\n \n {children}\n \n
\n);\n","function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nimport React from \"react\";\nexport default (({\n styles = {},\n ...props\n}) => /*#__PURE__*/React.createElement(\"svg\", _extends({\n xmlns: \"http://www.w3.org/2000/svg\",\n viewBox: \"0 0 160 146\"\n}, props), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M94.67 77.83a2.98 2.98 0 014-.3l54.9 42.87a2.98 2.98 0 01.47 4.23l-11.18 13.7a2.98 2.98 0 01-4.21.4L84.93 93.75a2.93 2.93 0 01-.52-3.94c3.34-4.7 5.55-6.99 10.26-11.98z\",\n fill: \"#003B29\"\n}), /*#__PURE__*/React.createElement(\"path\", {\n fillRule: \"evenodd\",\n clipRule: \"evenodd\",\n d: \"M152.52 121.75l-54.9-42.88a1.28 1.28 0 00-1.71.13c-.15.16-.3.3-.43.46-4.42 4.67-6.52 6.9-9.69 11.33-.36.51-.27 1.23.24 1.66l53.7 44.98a1.27 1.27 0 001.82-.17l11.17-13.7a1.27 1.27 0 00-.2-1.82zM98.67 77.53a2.98 2.98 0 00-4 .3l-.45.48c-4.4 4.66-6.58 6.96-9.81 11.5a2.93 2.93 0 00.53 3.94l53.7 44.98a2.98 2.98 0 004.22-.4l11.18-13.7a2.98 2.98 0 00-.47-4.22l-54.9-42.88z\"\n}), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M87.33 43.88c0 24.23-19.55 43.88-43.66 43.88C19.55 87.76 0 68.1 0 43.88 0 19.64 19.55 0 43.67 0c24.11 0 43.66 19.64 43.66 43.88z\",\n fill: \"#F5F5F5\"\n}), /*#__PURE__*/React.createElement(\"path\", {\n fillRule: \"evenodd\",\n clipRule: \"evenodd\",\n d: \"M43.67 86.06c23.17 0 41.96-18.88 41.96-42.18S66.83 1.7 43.67 1.7C20.5 1.7 1.7 20.58 1.7 43.88s18.8 42.18 41.97 42.18zm0 1.7c24.11 0 43.66-19.65 43.66-43.88C87.33 19.64 67.78 0 43.67 0 19.55 0 0 19.64 0 43.88 0 68.1 19.55 87.76 43.67 87.76z\"\n}), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M153.2 121.84a1.35 1.35 0 012.36 1.14l-1.58 7.55-5.78 6.67-6.35 2.85a1.5 1.5 0 01-1.77-2.32l13.12-15.88z\",\n fill: \"#FEF880\"\n}), /*#__PURE__*/React.createElement(\"path\", {\n fillRule: \"evenodd\",\n clipRule: \"evenodd\",\n d: \"M153.97 130.53l1.6-7.55a1.35 1.35 0 00-2.37-1.14l-13.12 15.89a1.5 1.5 0 001.77 2.32l6.35-2.86 5.77-6.66zm-6.8 5.27l5.23-6.05 1.2-5.73-11.66 14.12 5.23-2.34z\"\n}), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M152.25 129.62l3.18 1.1a4.25 4.25 0 012.59 2.53l1.45 3.9c.33.86.15 1.84-.45 2.55l-1.1 1.27a2.55 2.55 0 01-2.9.7l-3.69-1.52a4.24 4.24 0 01-1.7-1.28l-2.6-3.25 5.22-6z\",\n fill: \"#003B29\"\n}), /*#__PURE__*/React.createElement(\"path\", {\n fillRule: \"evenodd\",\n clipRule: \"evenodd\",\n d: \"M156.63 139.86l1.1-1.27a.85.85 0 00.15-.85l-1.45-3.9a2.55 2.55 0 00-1.56-1.51l-2.09-.73-3.53 4.07 1.7 2.14c.28.34.63.6 1.03.76l3.69 1.52c.34.14.73.05.96-.23zm-9.6-4.24l2.6 3.25a4.24 4.24 0 001.7 1.28l3.69 1.51a2.55 2.55 0 002.9-.7l1.1-1.26a2.55 2.55 0 00.45-2.56l-1.45-3.9a4.25 4.25 0 00-2.59-2.52l-3.18-1.1-5.21 6z\"\n}), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M28.9 57.37c0 5.75-4.43 10.41-9.88 10.41-5.46 0-9.89-4.66-9.89-10.4 0-5.76 4.43-10.42 9.88-10.42 5.46 0 9.88 4.66 9.88 10.41z\",\n fill: \"#fff\"\n}), /*#__PURE__*/React.createElement(\"path\", {\n fillRule: \"evenodd\",\n clipRule: \"evenodd\",\n d: \"M83.8 64.76a.85.85 0 01.18 1.19l-5.72 7.75-6.9 7a.85.85 0 11-1.2-1.19l6.8-6.91 5.65-7.66a.85.85 0 011.19-.18z\"\n}), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M81.21 70.4c.36-.4.96-.47 1.4-.16l9.94 6.97c.5.36.6 1.08.2 1.55l-.75.9 1.35 1.04-4.63 5.2-1.2-.88-1.4 1.69a1.06 1.06 0 01-1.51.13l-9.42-8.1a1.06 1.06 0 01-.1-1.52l6.12-6.82z\",\n fill: \"#FEF880\"\n}), /*#__PURE__*/React.createElement(\"path\", {\n fillRule: \"evenodd\",\n clipRule: \"evenodd\",\n d: \"M88.48 83.61l2.39-2.68-1.3-1L91 78.2l-8.91-6.25-5.3 5.92 8.42 7.25 2.02-2.44 1.24.93zm.23 2.3l-1.2-.9-1.4 1.7a1.06 1.06 0 01-1.5.13l-9.42-8.1a1.06 1.06 0 01-.1-1.52l6.12-6.82c.36-.4.96-.47 1.4-.16l9.94 6.97a1.06 1.06 0 01.2 1.55l-.75.9 1.35 1.04-4.63 5.2z\"\n}), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M160 143.75c0 1.23-7.95 2.23-17.74 2.23s-17.75-1-17.75-2.23c0-1.24 7.95-2.23 17.75-2.23s17.74 1 17.74 2.23z\",\n fill: \"#EDEAEA\"\n})));","// extracted by mini-css-extract-plugin\nexport default {\"not-clickable\":\"not-clickable--T0+hi\",\"notClickable\":\"not-clickable--T0+hi\",\"tree-item\":\"tree-item--5FTd9\",\"treeItem\":\"tree-item--5FTd9\",\"item-name\":\"item-name--injN3\",\"itemName\":\"item-name--injN3\",\"active\":\"active--LsORl\"};","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { formatNumber } from 'packages/format';\nimport { Button } from 'tradera/components/atoms/button/button';\nimport styles from './tree-item.module.scss';\nimport cn from 'classnames';\n\nconst ItemContent = ({\n uniqueId,\n name,\n childrenCount,\n isActiveParentNode,\n isAllCategoriesActiveParent\n}) => {\n return (\n <>\n \n
{t('error_oops')}
\n{t('error_cantLoadItems')}
\n{t('error_tryAgainLater')}
\n\n
\n
\n \n \n );\n};\n\nLayoutA.propTypes = {\n aside: PropTypes.node.isRequired,\n mainContent: PropTypes.node.isRequired,\n children: PropTypes.node,\n heroContent: PropTypes.node,\n classes: PropTypes.string,\n reversed: PropTypes.bool\n};\n\nLayoutA.defaultProps = {\n heroContent: null,\n classes: '',\n reversed: false\n};\n"],"sourceRoot":""}\n {children}\n \n \n {aside}\n \n \n {mainContent}\n \n
\n