{"version":3,"sources":["webpack:///./src/Frontend/app/components/title-link-top/title-link-top.tsx","webpack:///./src/Frontend/app/components/teaser-grid/teaser-tile/teaser-tile.tsx","webpack:///./src/Frontend/app/components/teaser-grid/teaser-grid.tsx","webpack:///./src/Frontend/app/views/teaser-grid/teaser-grid-view.tsx","webpack:///./src/Frontend/app/components/icons/icon.tsx","webpack:///./src/Frontend/app/components/anchor/anchor.tsx","webpack:///./src/Frontend/app/components/content-section/content-section.tsx","webpack:///./src/Frontend/app/components/arrow-link/arrow-link.tsx","webpack:///./src/Frontend/app/utils/image-utils.ts","webpack:///./src/Frontend/app/components/responsive-image/responsive-image.tsx","webpack:///./src/Frontend/app/components/tag/tag.tsx","webpack:///./src/Frontend/app/components/spinner/spinner.tsx","webpack:///./src/Frontend/app/components/button/button.tsx"],"names":["className","title","viewMoreLink","baseClass","componentClasses","headerTitle","dangerouslySetInnerHTML","__html","headerLink","link","TileType","TemplateType","tileTypes","COL__1","srcSetSizes","sizes","COL__2","COL__4","LIST","imageSrc","imageAltText","tag","subtitle","richText","pageUrl","pageTarget","truncateTitle","hideRichText","date","props","tileType","rootClasses","href","target","srcUrl","defaultSize","alt","lines","templateTypes","T1","repeats","pattern","T2","T3","T4","T5","T6","templateType","loadMoreWebApiUrl","loadMoreBtnLabel","loadMorePageSize","filterTags","state","dispatch","teaserListFromStore","displayedTeasersOutOfTotalLabelFromStore","pageFromStore","teasersTotalCountFromStore","isLoadMorePending","teaserList","displayedTeasersOutOfTotalLabel","page","teasersTotalCount","showLoadMoreBtn","length","searchParams","TeaserItem","item","TeaserItemGroup","items","map","index","key","getTileType","template","tileIndex","reduce","pushTarget","pushItem","Array","isArray","push","isLarge","onClick","params","teaserParams","apiUrl","POST","then","response","payload","catch","disabled","render","this","contextModel","spriteUrl","viewBox","iconId","preserveAspectRatio","xmlnsXlink","xlinkHref","id","type","anchorId","hasNoMarginTop","hasNoMarginBottom","children","getQueryParamDelimiter","url","indexOf","hasExistingQueryParam","generateSrcSet","srcSetSize","parameterDelimiter","srcSetSizeHighDensity","Math","round","join","generateColumnImageProps","maxColumns","isFullWidth","gridMaxWidthFactor","ResponsiveImage","ref","src","srcSet","loading","tagTypeClassMap","NEWS","SPOT","BESTSELLER","BOOK_OF_THE_MONTH","UPCOMING","classModifier","shape","size","isInverted","isSecondary","e"],"mappings":"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","file":"20.2eb424406a5b5fd59400.js","sourcesContent":["import * as React from \"react\";\r\nimport classNames from \"classnames\";\r\n\r\nimport ArrowLink from \"../arrow-link/arrow-link\";\r\n\r\nexport interface ITitleLinkTopProps {\r\n    className?: string;\r\n    title?: string;\r\n    viewMoreLink?: string;\r\n}\r\n\r\nconst TitleLinkTop = ({ className, title, viewMoreLink }: ITitleLinkTopProps) => {\r\n    const baseClass = \"title-link-top\";\r\n    const componentClasses = classNames(baseClass, className);\r\n\r\n    const headerTitle = title && (\r\n        <h2 className={`${baseClass}__title h2-style`} dangerouslySetInnerHTML={{ __html: title }} />\r\n    );\r\n    const headerLink = viewMoreLink && <ArrowLink className={`${baseClass}__link`} link={viewMoreLink} />;\r\n\r\n    return (\r\n        <div className={componentClasses}>\r\n            {(headerTitle || headerLink) && (\r\n                <div className={`${baseClass}__inner`}>\r\n                    {headerTitle}\r\n                    {headerLink}\r\n                </div>\r\n            )}\r\n        </div>\r\n    );\r\n};\r\n\r\nexport default TitleLinkTop;\r\n","import * as React from \"react\";\r\nimport ResponsiveImage from \"~/components/responsive-image/responsive-image\";\r\nimport Tag from \"~/components/tag/tag\";\r\nimport TruncateMarkup from \"react-truncate-markup\";\r\nimport classNames from \"classnames\";\r\n\r\nexport enum TileType {\r\n    COL__1 = \"col-1\",\r\n    COL__2 = \"col-2\",\r\n    COL__4 = \"col-4\",\r\n    LIST = \"list\"\r\n}\r\n\r\nconst tileTypes = {\r\n    [TileType.COL__1]: {\r\n        // Size 423px is needed for desktop, since col-1 can be both 25% and 33% wide\r\n        srcSetSizes: [607, 402, 518, 423],\r\n        sizes: `(max-width: 639px) 607px, (max-width: 867px) 402px, (max-width: 1099px) 518px, 423px`\r\n    },\r\n    [TileType.COL__2]: {\r\n        // Size 867px is needed since template 3 and 4 show col-2 in 100% on this breakpoint\r\n        srcSetSizes: [607, 835, 518, 651],\r\n        sizes: `(max-width: 639px) 607px, (max-width: 867px) 835px, (max-width: 1099px) 518px, 651px`\r\n    },\r\n    [TileType.COL__4]: {\r\n        srcSetSizes: [607, 835, 671, 838],\r\n        sizes: \"(max-width: 639px) 607px, (max-width: 867px) 835px, (max-width: 1099px) 671px, 838px\"\r\n    },\r\n    [TileType.LIST]: {\r\n        srcSetSizes: [607, 314, 195, 245],\r\n        sizes: `(max-width: 639px) 607px, (max-width: 867px) 314px, (max-width: 1099px) 195px, 245px`\r\n    }\r\n};\r\n\r\nexport interface ITeaserTile {\r\n    imageSrc?: string;\r\n    imageAltText?: string;\r\n    tag?: string;\r\n    title?: string; // Recommended max: 28 characters\r\n    subtitle?: string; // Recommended max: 30 characters\r\n    richText?: string; // Recommended max: 262 characters\r\n    pageUrl?: string;\r\n    pageTarget?: string;\r\n    truncateTitle?: boolean;\r\n    hideRichText?: boolean;\r\n    tileType?: TileType;\r\n    date?: string;\r\n}\r\n\r\nconst TeaserTile = ({\r\n    imageSrc,\r\n    imageAltText,\r\n    tag,\r\n    title,\r\n    subtitle,\r\n    richText,\r\n    pageUrl,\r\n    pageTarget,\r\n    truncateTitle,\r\n    hideRichText,\r\n    date,\r\n    ...props\r\n}: ITeaserTile) => {\r\n    const tileType = props.tileType || TileType.COL__1;\r\n    const baseClass = \"teaser-tile\";\r\n    const rootClasses = classNames(baseClass, [`${baseClass}--tile-type-${tileType}`]);\r\n\r\n    return (\r\n        <div className={rootClasses}>\r\n            {imageSrc && (\r\n                <a className={`${baseClass}__image-wrapper`} href={pageUrl} target={pageTarget}>\r\n                    <div className={`${baseClass}__image-container`}>\r\n                        <ResponsiveImage\r\n                            srcUrl={imageSrc}\r\n                            defaultSize={639}\r\n                            srcSetSizes={tileTypes[tileType].srcSetSizes}\r\n                            sizes={tileTypes[tileType].sizes}\r\n                            alt={imageAltText}\r\n                        />\r\n                    </div>\r\n                </a>\r\n            )}\r\n            <div className={`${baseClass}__content-wrapper`}>\r\n                <div className={`${baseClass}__content-container`}>\r\n                    {tag && <Tag className={`${baseClass}__tag`}>{tag}</Tag>}\r\n\r\n                    {props.tileType !== TileType.LIST ? (\r\n                        <p className={`${baseClass}__date`}>{date ?? <>&nbsp;</>}</p>\r\n                    ) : (\r\n                        date && <p className={`${baseClass}__date`}>{date}</p>\r\n                    )}\r\n\r\n                    {title && (\r\n                        <a className={`${baseClass}__title-link`} href={pageUrl} target={pageTarget}>\r\n                            {truncateTitle ? (\r\n                                <TruncateMarkup lines={2}>\r\n                                    <h3\r\n                                        className={`${baseClass}__title h3-style`}\r\n                                        dangerouslySetInnerHTML={{ __html: title }}\r\n                                    />\r\n                                </TruncateMarkup>\r\n                            ) : (\r\n                                <h3\r\n                                    className={`${baseClass}__title h3-style`}\r\n                                    dangerouslySetInnerHTML={{ __html: title }}\r\n                                />\r\n                            )}\r\n                        </a>\r\n                    )}\r\n\r\n                    {subtitle && <p className={`${baseClass}__subtitle`}>{subtitle}</p>}\r\n\r\n                    {!hideRichText && richText && (\r\n                        <div\r\n                            className={`${baseClass}__rich-text`}\r\n                            dangerouslySetInnerHTML={{ __html: richText }}\r\n                        />\r\n                    )}\r\n                </div>\r\n            </div>\r\n        </div>\r\n    );\r\n};\r\n\r\nexport default TeaserTile;\r\n","import * as React from \"react\";\r\nimport classNames from \"classnames\";\r\nimport TitleLinkTop, { ITitleLinkTopProps } from \"../title-link-top/title-link-top\";\r\nimport TeaserTile, { ITeaserTile, TileType } from \"./teaser-tile/teaser-tile\";\r\nimport Button from \"../button/button\";\r\nimport { TeaserResponse } from \"~/store/reducers/teasers/teaser-actions\";\r\nimport * as teaserActions from \"~/store/reducers/teasers/teaser-actions\";\r\nimport teaserReducer, {\r\n    TeaserParams,\r\n    TeaserState,\r\n    initialState as teaserState\r\n} from \"~/store/reducers/teasers/teaser-reducer\";\r\nimport { callServer, padRootUrl } from \"~/api/call-server\";\r\nimport { RequestType } from \"~/api/response-types/types\";\r\nimport ContentSection from \"../content-section/content-section\";\r\n\r\nexport enum TemplateType {\r\n    T1 = \"template-1\",\r\n    T2 = \"template-2\",\r\n    T3 = \"template-3\",\r\n    T4 = \"template-4\",\r\n    T5 = \"template-5\",\r\n    T6 = \"template-6\"\r\n}\r\n\r\nconst templateTypes = {\r\n    [TemplateType.T1]: { repeats: true, pattern: [TileType.COL__1] },\r\n    [TemplateType.T2]: { repeats: true, pattern: [TileType.COL__2] },\r\n    [TemplateType.T3]: {\r\n        repeats: true,\r\n        pattern: [\r\n            TileType.COL__2,\r\n            TileType.COL__1,\r\n            TileType.COL__1,\r\n            TileType.COL__1,\r\n            TileType.COL__1,\r\n            TileType.COL__2\r\n        ]\r\n    },\r\n    [TemplateType.T4]: {\r\n        repeats: true,\r\n        pattern: [\r\n            TileType.COL__1,\r\n            TileType.COL__1,\r\n            TileType.COL__2,\r\n            TileType.COL__2,\r\n            TileType.COL__1,\r\n            TileType.COL__1\r\n        ]\r\n    },\r\n    [TemplateType.T5]: {\r\n        repeats: false,\r\n        pattern: [TileType.COL__2, TileType.LIST, TileType.LIST, TileType.LIST]\r\n    },\r\n    [TemplateType.T6]: { repeats: false, pattern: [TileType.COL__4] }\r\n};\r\n\r\ninterface TeaserGridPropsFromStore {\r\n    teaserListFromStore?: ITeaserTile[];\r\n    displayedTeasersOutOfTotalLabelFromStore?: string;\r\n    pageFromStore?: number;\r\n    teasersTotalCountFromStore?: number;\r\n    showLoadMoreBtn?: boolean;\r\n    filterTags?: string[];\r\n}\r\n\r\nexport interface ITeaserGridProps\r\n    extends ITitleLinkTopProps,\r\n        Omit<TeaserState, \"teasers\" | \"teaserParams\">,\r\n        TeaserParams,\r\n        TeaserGridPropsFromStore {\r\n    className?: string;\r\n    hasNoMarginTop?: boolean;\r\n    hasNoMarginBottom?: boolean;\r\n    title?: string;\r\n    viewMoreLink?: string;\r\n    templateType: TemplateType;\r\n    teaserList?: ITeaserTile[];\r\n    loadMoreWebApiUrl?: string;\r\n    loadMoreBtnLabel?: string;\r\n    anchorId?: string;\r\n}\r\n\r\nconst TeaserGrid = ({\r\n    className,\r\n    title,\r\n    viewMoreLink,\r\n    templateType,\r\n    loadMoreWebApiUrl,\r\n    loadMoreBtnLabel,\r\n    loadMorePageSize,\r\n    filterTags,\r\n    ...props\r\n}: ITeaserGridProps) => {\r\n    const baseClass = \"teaser-grid\";\r\n    const componentClasses = classNames(baseClass, className, `${baseClass}--${templateType}`);\r\n\r\n    const [state, dispatch] = React.useReducer(teaserReducer, teaserState);\r\n\r\n    const {\r\n        teaserList: teaserListFromStore,\r\n        displayedTeasersOutOfTotalLabel: displayedTeasersOutOfTotalLabelFromStore,\r\n        teaserParams: { page: pageFromStore },\r\n        teasersTotalCount: teasersTotalCountFromStore,\r\n        isLoadMorePending\r\n    } = state;\r\n\r\n    const teaserList = teaserListFromStore || props.teaserList;\r\n    const displayedTeasersOutOfTotalLabel =\r\n        displayedTeasersOutOfTotalLabelFromStore || props.displayedTeasersOutOfTotalLabel;\r\n    const page = pageFromStore || props.page;\r\n    const teasersTotalCount = teasersTotalCountFromStore || props.teasersTotalCount;\r\n    const canLoadMore = teaserList && teasersTotalCount && teasersTotalCount > teaserList.length;\r\n    const showLoadMoreBtn = !!(canLoadMore && loadMoreBtnLabel && props.showLoadMoreBtn);\r\n\r\n    // Populate the store and set load-more params on mount\r\n    React.useEffect(() => {\r\n        const searchParams: TeaserParams = {\r\n            page,\r\n            loadMorePageSize,\r\n            filterTags\r\n        };\r\n\r\n        dispatch(teaserActions.updateTeaserParams(searchParams));\r\n        dispatch(teaserActions.populateTeasers({ teaserList: props.teaserList }));\r\n    }, []);\r\n\r\n    const onLoadMore = () => {\r\n        if (!loadMoreWebApiUrl) {\r\n            return;\r\n        }\r\n\r\n        const params = {\r\n            ...state.teaserParams,\r\n            apiUrl: loadMoreWebApiUrl,\r\n            loadMorePageSize,\r\n            // TODO: Couldn't this just be (page || 0) + 1? What happens if page is undefined?\r\n            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\r\n            page: page! + 1\r\n        };\r\n\r\n        dispatch(teaserActions.teaserRequest(params));\r\n\r\n        callServer<TeaserResponse>(padRootUrl(loadMoreWebApiUrl), RequestType.POST, params)\r\n            .then((response: any) => {\r\n                dispatch(teaserActions.teaserSuccess({ ...response.payload, page: params.page }));\r\n                dispatch(teaserActions.updateTeaserParams(params));\r\n            })\r\n            .catch(() => {\r\n                dispatch(teaserActions.teaserError());\r\n            });\r\n    };\r\n    const TeaserItem = ({\r\n        item,\r\n        truncateTitle,\r\n        tileType,\r\n        hideRichText\r\n    }: {\r\n        item: ITeaserTile;\r\n        truncateTitle?: boolean;\r\n        tileType: TileType;\r\n        hideRichText?: boolean;\r\n    }) => (\r\n        <div className={`${baseClass}__item`}>\r\n            <TeaserTile\r\n                {...item}\r\n                hideRichText={hideRichText}\r\n                truncateTitle={truncateTitle}\r\n                tileType={tileType}\r\n            />\r\n        </div>\r\n    );\r\n\r\n    const TeaserItemGroup = ({ items, tileType }: { items: ITeaserTile[]; tileType: TileType }) => (\r\n        <div className={`${baseClass}__item-group`}>\r\n            {items.map((item, index) => (\r\n                <TeaserItem item={item} key={index} hideRichText truncateTitle tileType={tileType} />\r\n            ))}\r\n        </div>\r\n    );\r\n\r\n    const getTileType = (template: ITeaserGridProps[\"templateType\"], tileIndex: number) => {\r\n        if (teaserList?.length === 1) {\r\n            return TileType.COL__4;\r\n        }\r\n        const { pattern, repeats } = templateTypes[template];\r\n\r\n        const tileType = repeats\r\n            ? pattern[tileIndex % pattern.length]\r\n            : pattern[tileIndex] || TileType.COL__1;\r\n        return tileType;\r\n    };\r\n\r\n    return (\r\n        <ContentSection className={componentClasses} {...props}>\r\n            <TitleLinkTop title={title} viewMoreLink={viewMoreLink} />\r\n            {teaserList && (\r\n                <>\r\n                    <div className={`${baseClass}__items`}>\r\n                        {templateType !== \"template-5\"\r\n                            ? teaserList.map((item, index) => {\r\n                                  return (\r\n                                      <div key={index} className={`${baseClass}__item`}>\r\n                                          <TeaserTile {...item} tileType={getTileType(templateType, index)} />\r\n                                      </div>\r\n                                  );\r\n                              })\r\n                            : teaserList\r\n                                  .reduce((items: Array<ITeaserTile | ITeaserTile[]>, item, index) => {\r\n                                      // Only items 2, 3, and 4 should be wrapped\r\n                                      const toBuffer = index === 1 || index === 2 || index === 3;\r\n\r\n                                      let pushTarget = items; // Where to allocate the item\r\n                                      let pushItem: ITeaserTile | ITeaserTile[] = item; // Item to be allocated\r\n\r\n                                      if (toBuffer) {\r\n                                          if (Array.isArray(items[items.length - 1])) {\r\n                                              // We already have a buffer group to allocate to\r\n                                              pushTarget = items[items.length - 1] as ITeaserTile[];\r\n                                          } else {\r\n                                              // We create a new buffer group\r\n                                              pushItem = [item];\r\n                                          }\r\n                                      }\r\n\r\n                                      pushTarget.push(pushItem);\r\n\r\n                                      return items;\r\n                                  }, [])\r\n                                  .map((item, index) => {\r\n                                      if (Array.isArray(item)) {\r\n                                          return (\r\n                                              <TeaserItemGroup\r\n                                                  items={item}\r\n                                                  key={index}\r\n                                                  tileType={TileType.LIST}\r\n                                              />\r\n                                          );\r\n                                      } else if (teaserList?.length === 1) {\r\n                                          return (\r\n                                              <TeaserItem\r\n                                                  item={item}\r\n                                                  key={index}\r\n                                                  tileType={TileType.COL__4}\r\n                                              />\r\n                                          );\r\n                                      } else {\r\n                                          return (\r\n                                              <TeaserItem\r\n                                                  item={item}\r\n                                                  key={index}\r\n                                                  tileType={TileType.COL__2}\r\n                                              />\r\n                                          );\r\n                                      }\r\n                                  })}\r\n                    </div>\r\n                    {displayedTeasersOutOfTotalLabel && (\r\n                        <div className={`${baseClass}__x-of-y`}>{displayedTeasersOutOfTotalLabel}</div>\r\n                    )}\r\n                    {showLoadMoreBtn && (\r\n                        <div className={`${baseClass}__button-wrapper`}>\r\n                            <Button\r\n                                className={`${baseClass}__button button--inverted`}\r\n                                isLarge\r\n                                onClick={onLoadMore}\r\n                                disabled={isLoadMorePending}\r\n                            >\r\n                                {loadMoreBtnLabel}\r\n                            </Button>\r\n                        </div>\r\n                    )}\r\n                </>\r\n            )}\r\n        </ContentSection>\r\n    );\r\n};\r\n\r\nexport default TeaserGrid;\r\n","import * as React from \"react\";\r\nimport TeaserGrid, { ITeaserGridProps } from \"~/components/teaser-grid/teaser-grid\";\r\n\r\nexport interface ITeaserGridViewProps {\r\n    contextModel: ITeaserGridProps;\r\n}\r\n\r\nclass TeaserGridView extends React.PureComponent<ITeaserGridViewProps> {\r\n    public render() {\r\n        return <TeaserGrid {...this.props.contextModel} />;\r\n    }\r\n}\r\n\r\nexport default TeaserGridView;\r\n","import * as React from \"react\";\r\nimport classNames from \"classnames\";\r\n\r\nexport type TIconNames =\r\n    | \"24_expand\"\r\n    | \"24_play\"\r\n    | \"24_star\"\r\n    | \"24_trash\"\r\n    | \"32_add-user\"\r\n    | \"32_basket\"\r\n    | \"32_checkmark-circle\"\r\n    | \"32_checkmark\"\r\n    | \"32_error\"\r\n    | \"32_information\"\r\n    | \"32_katalog\"\r\n    | \"32_search\"\r\n    | \"32_truck-in-motion\"\r\n    | \"32_user\"\r\n    | \"32_warning\"\r\n    | \"icon_16_arrow-down\"\r\n    | \"icon_16_arrow-left\"\r\n    | \"icon_16_arrow-right-bold\"\r\n    | \"icon_16_arrow-right\"\r\n    | \"icon_16_arrow-up\"\r\n    | \"icon_28_close\"\r\n    | \"icon_32_thumbs-up\"\r\n    | \"icon_80x41_quotation-mark-gyldendal-dk\"\r\n    | \"icon_80x48_quotation-mark\"\r\n    | \"icon_checkbox-black\"\r\n    | \"icon_checkmark-black\"\r\n    | \"icon_download\"\r\n    | \"icon_herringbone-narrow\"\r\n    | \"icon_herringbone-wide\"\r\n    | \"icon_placeholder-email\"\r\n    | \"icon_placeholder-lock\"\r\n    | \"icon_placeholder-phone-small\"\r\n    | \"icon_placeholder-vip-white\"\r\n    | \"icon_placeholder_basket\"\r\n    | \"icon_placeholder_checkmark\"\r\n    | \"icon_placeholder_eye-closed\"\r\n    | \"icon_placeholder_eye\"\r\n    | \"icon_placeholder_facebook\"\r\n    | \"icon_placeholder_filtering\"\r\n    | \"icon_placeholder_hamburger\"\r\n    | \"icon_placeholder_instagram\"\r\n    | \"icon_placeholder_phone\"\r\n    | \"icon_placeholder_user\"\r\n    | \"icon_read\"\r\n    | \"icon_listen\";\r\n\r\nexport interface IIconProps {\r\n    iconId: TIconNames;\r\n    spriteUrl?: string;\r\n    viewBox?: string;\r\n    className?: string;\r\n    onClick?: () => void;\r\n}\r\n\r\nconst Icon: React.FC<IIconProps> = props => {\r\n    const spriteUrl = props.spriteUrl || \"\";\r\n    const viewBox = props.viewBox || \"0 0 32 32\";\r\n\r\n    return (\r\n        <svg\r\n            viewBox={viewBox}\r\n            className={classNames(props.className, \"icon\", `icon-${props.iconId}`)}\r\n            preserveAspectRatio=\"xMidYMid\"\r\n            onClick={() => props.onClick && props.onClick()}\r\n        >\r\n            <use xmlnsXlink=\"http://www.w3.org/1999/xlink\" xlinkHref={`${spriteUrl}#${props.iconId}`} />\r\n        </svg>\r\n    );\r\n};\r\n\r\nexport default Icon;\r\n","import * as React from \"react\";\r\n\r\nexport interface AnchorProps {\r\n    id?: string;\r\n}\r\n\r\nconst Anchor = ({ id }: AnchorProps) => {\r\n    return <div className=\"anchor\" id={id} />;\r\n};\r\n\r\nexport default Anchor;\r\n","import classNames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport Anchor from \"../anchor/anchor\";\r\n\r\nexport interface ContentSectionProps {\r\n    className?: string;\r\n    type?: \"default\" | \"full\";\r\n    anchorId?: string;\r\n    hasNoMarginTop?: boolean;\r\n    hasNoMarginBottom?: boolean;\r\n}\r\n\r\nconst ContentSection: React.FC<ContentSectionProps> = ({\r\n    className,\r\n    type = \"default\",\r\n    anchorId,\r\n    hasNoMarginTop,\r\n    hasNoMarginBottom,\r\n    ...props\r\n}) => {\r\n    const baseClass = \"content-section\";\r\n    const componentClasses = classNames(baseClass, className, {\r\n        [`${baseClass}--full`]: type === \"full\",\r\n        \"anchor-wrapper\": !!anchorId,\r\n        \"content-no-margin-top\": hasNoMarginTop,\r\n        \"content-no-margin-bottom\": hasNoMarginBottom\r\n    });\r\n    return (\r\n        <section className={componentClasses}>\r\n            {anchorId && <Anchor id={anchorId} />}\r\n            {props.children}\r\n        </section>\r\n    );\r\n};\r\n\r\nexport default ContentSection;\r\n","import * as React from \"react\";\r\nimport classNames from \"classnames\";\r\nimport Icon from \"../icons/icon\";\r\n\r\nexport interface IArrowLinkProps {\r\n    className?: string;\r\n    link: string;\r\n}\r\n\r\nconst ArrowLink = ({ className, link }: IArrowLinkProps) => {\r\n    const baseClass = \"arrow-link\";\r\n    const componentClasses = classNames(baseClass, className);\r\n\r\n    return (\r\n        <div className={componentClasses}>\r\n            <Icon iconId=\"icon_16_arrow-right-bold\" />\r\n            <span dangerouslySetInnerHTML={{ __html: link }} />\r\n        </div>\r\n    );\r\n};\r\n\r\nexport default ArrowLink;\r\n","const hasExistingQueryParam = (url: string) => url.indexOf(\"?\") !== -1;\r\n\r\nexport const getQueryParamDelimiter = (url: string) => (hasExistingQueryParam(url) ? \"&\" : \"?\");\r\n\r\nexport const generateSrcSet = (srcSetSizes: number[], srcUrl: string) => {\r\n    const generateSrcSetString = (srcSetSize: number) => {\r\n        const parameterDelimiter = getQueryParamDelimiter(srcUrl);\r\n        const srcSetSizeHighDensity = Math.round(srcSetSize * 1.5);\r\n\r\n        return `\r\n            ${srcUrl}${parameterDelimiter}w=${srcSetSize} ${srcSetSize}w,\r\n            ${srcUrl}${parameterDelimiter}w=${srcSetSizeHighDensity} ${srcSetSizeHighDensity}w\r\n        `;\r\n    };\r\n\r\n    return srcSetSizes.map(generateSrcSetString).join(\", \");\r\n};\r\n\r\nexport const generateColumnImageProps = (maxColumns: number, isFullWidth?: boolean) => {\r\n    // The sizes are column-widths and are not considering padding\r\n    const gridMaxWidthFactor = isFullWidth ? 1 : 0.75;\r\n    const gridMaxWidth = 1366 * gridMaxWidthFactor;\r\n    const defaultSize = gridMaxWidth / maxColumns;\r\n    let sizes;\r\n\r\n    switch (maxColumns) {\r\n        case 5:\r\n            sizes = `(max-width: 479px) 100vw, \r\n            (max-width: 639px) 75vw,\r\n            (max-width: 767px) 50vw,\r\n            (max-width: 1023px) ${100 / 3}vw,\r\n            (max-width: 1099px) ${(100 / 3) * gridMaxWidthFactor}vw,\r\n            (max-width: 1279px) ${(100 / 4) * gridMaxWidthFactor}vw,\r\n            ${defaultSize}px`;\r\n        case 4:\r\n            sizes = `(max-width: 479px) 100vw, \r\n            (max-width: 639px) 75vw,\r\n            (max-width: 767px) 50vw,\r\n            (max-width: 1023px) ${100 / 3}vw,\r\n            (max-width: 1099px) ${(100 / 3) * gridMaxWidthFactor}vw,\r\n            (max-width: 1279px) ${(100 / 4) * gridMaxWidthFactor}vw,\r\n            ${defaultSize}px`;\r\n        case 3:\r\n            sizes = `(max-width: 479px) 100vw,\r\n            (max-width: 639px) 75vw,\r\n            (max-width: 767px) 50vw,\r\n            (max-width: 1023px) ${100 / 3}vw,\r\n            (max-width: 1279px) ${(100 / 3) * gridMaxWidthFactor}vw,\r\n            ${defaultSize}px`;\r\n        case 2:\r\n            sizes = `(max-width: 479px) 100vw,\r\n            (max-width: 639px) 75vw,\r\n            (max-width: 1023px) ${100 / 2}vw,\r\n            (max-width: 1279px) ${(100 / 2) * gridMaxWidthFactor}vw, \r\n            ${defaultSize}px`;\r\n        case 1:\r\n            sizes = `(max-width: 479px) 100vw,\r\n            (max-width: 1023px) ${100 * 0.75}vw,\r\n            (max-width: 1279px) ${100 * 0.75 * gridMaxWidthFactor}vw,\r\n            ${defaultSize * 0.75}px`;\r\n    }\r\n\r\n    return {\r\n        // The sizes are column-widths and are not considering padding\r\n        defaultSize: defaultSize,\r\n        srcSetSizes: [205, 257, 274, 342, 456, 513, 683, 769, 1025],\r\n        sizes: sizes\r\n    };\r\n};\r\n","import * as React from \"react\";\r\nimport { generateSrcSet, getQueryParamDelimiter } from \"~/utils/image-utils\";\r\n\r\nexport interface IResponsiveImageProps extends Omit<React.ImgHTMLAttributes<HTMLImageElement>, \"src\"> {\r\n    className?: string;\r\n    srcUrl: string;\r\n    defaultSize: number;\r\n    srcSetSizes?: number[];\r\n    sizes?: string;\r\n    ref?: React.Ref<HTMLImageElement>;\r\n}\r\n\r\nconst ResponsiveImage: React.FC<IResponsiveImageProps> = React.forwardRef(\r\n    ({ srcUrl, defaultSize, srcSetSizes, ...props }, ref: React.Ref<HTMLImageElement>) => {\r\n        const src = `${srcUrl}${getQueryParamDelimiter(srcUrl)}w=${defaultSize}`;\r\n        const srcSet = srcSetSizes ? generateSrcSet(srcSetSizes, srcUrl) : \"\";\r\n\r\n        return <img ref={ref} src={src} srcSet={srcSet} {...props} loading=\"lazy\" />;\r\n    }\r\n);\r\n\r\nexport default ResponsiveImage;\r\n","import * as React from \"react\";\r\nimport classNames from \"classnames\";\r\nimport { ProductStatus } from \"~/types/product\";\r\n\r\nexport interface ITagProps {\r\n    type?: ProductStatus;\r\n    children: React.ReactNode;\r\n    className?: string;\r\n    shape?: \"pill\" | \"square\";\r\n}\r\n\r\nexport const tagTypeClassMap: { [key in ProductStatus]: string } = {\r\n    NEWS: \"news\",\r\n    SPOT: \"spot\",\r\n    BESTSELLER: \"bestseller\",\r\n    BOOK_OF_THE_MONTH: \"botm\",\r\n    UPCOMING: \"upcoming\"\r\n};\r\n\r\nconst Tag: React.FC<ITagProps> = props => {\r\n    const classModifier = props.type && tagTypeClassMap[props.type];\r\n    const rootClasses = classNames(\"tag\", props.className, `tag--shape-${props.shape || \"pill\"}`, {\r\n        [`tag--${classModifier}`]: props.type\r\n    });\r\n\r\n    return (\r\n        <div className={rootClasses}>\r\n            <span className=\"tag__label\">{props.children}</span>\r\n        </div>\r\n    );\r\n};\r\n\r\nexport default Tag;\r\n","import classNames from \"classnames\";\r\nimport * as React from \"react\";\r\n\r\ninterface ISpinnerProps {\r\n    size?: \"small\" | \"default\";\r\n    className?: string;\r\n}\r\nconst Spinner = ({ size = \"default\", className }: ISpinnerProps) => {\r\n    const baseClass = \"spinner\";\r\n    const componentClasses = classNames(baseClass, className, {\r\n        [`${baseClass}--${size}`]: size !== \"default\"\r\n    });\r\n\r\n    return <span className={componentClasses} />;\r\n};\r\n\r\nexport default Spinner;\r\n","import * as React from \"react\";\r\nimport classNames from \"classnames\";\r\nimport Icon, { TIconNames } from \"../icons/icon\";\r\nimport Spinner from \"~/components/spinner/spinner\";\r\n\r\ntype IOnClickFunction = (e: React.MouseEvent<HTMLButtonElement>) => void;\r\n\r\nexport interface IButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n    onClick?: IOnClickFunction;\r\n    disabled?: boolean;\r\n    className?: string;\r\n    loading?: boolean;\r\n    iconId?: TIconNames;\r\n    isLarge?: boolean;\r\n    isInverted?: boolean;\r\n    isSecondary?: boolean;\r\n}\r\n\r\nconst Button: React.SFC<IButtonProps> = props => {\r\n    const baseClass = \"button\";\r\n    const componentClasses = classNames(baseClass, props.className, {\r\n        [`${baseClass}--large`]: props.isLarge,\r\n        [`${baseClass}--inverted`]: props.isInverted,\r\n        [`${baseClass}--secondary`]: props.isSecondary,\r\n        [`${baseClass}--loading`]: props.loading\r\n    });\r\n\r\n    return (\r\n        <button\r\n            className={componentClasses}\r\n            type={props.type || \"button\"}\r\n            disabled={!!(props.disabled || props.loading)}\r\n            onClick={e => {\r\n                if (props.onClick) {\r\n                    props.onClick(e);\r\n                }\r\n            }}\r\n        >\r\n            {props.iconId && <Icon iconId={props.iconId} className={`${baseClass}__icon`} />}\r\n            {props.loading && <Spinner />}\r\n            <span className={`${baseClass}__text`}>{props.children}</span>\r\n        </button>\r\n    );\r\n};\r\nexport default Button;\r\n"],"sourceRoot":""}