{"version":3,"file":"src_exported_loyalty-marketing-page_LoyaltyMarketingPage_tsx.028a1eab12eb6a8da0cc.bundle.js","mappings":"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","sources":["webpack://pincer-loyalty/./node_modules/@estee/elc-tabs/src/views/Tab.tsx","webpack://pincer-loyalty/./node_modules/@estee/elc-tabs/node_modules/@estee/elc-base-theme/src/ContentSpacing.ts","webpack://pincer-loyalty/./node_modules/@estee/elc-tabs/node_modules/@estee/elc-base-theme/src/Breakpoints.ts","webpack://pincer-loyalty/./node_modules/@estee/elc-tabs/node_modules/@estee/elc-base-theme/src/Emphasis.ts","webpack://pincer-loyalty/./node_modules/@estee/elc-tabs/node_modules/@estee/elc-base-theme/src/Colors.ts","webpack://pincer-loyalty/./node_modules/@estee/elc-tabs/src/theme/default-theme.ts","webpack://pincer-loyalty/./node_modules/@estee/elc-tabs/src/views/TabHeader.tsx","webpack://pincer-loyalty/./node_modules/@estee/elc-tabs/src/views/TabPanel.tsx","webpack://pincer-loyalty/./node_modules/@estee/elc-tabs/src/views/Tabs.tsx","webpack://pincer-loyalty/./src/internal/views/marketing-page/sections.ts","webpack://pincer-loyalty/./src/internal/views/marketing-page/benefits-rewards/BenefitsRewardsTableHeader.tsx","webpack://pincer-loyalty/./src/internal/views/marketing-page/benefits-rewards/BenefitsRewardsTableThead.tsx","webpack://pincer-loyalty/./src/internal/views/marketing-page/benefits-rewards/BenefitsRewardsItem.tsx","webpack://pincer-loyalty/./node_modules/@estee/elc-grid/src/views/Responsive.tsx","webpack://pincer-loyalty/./node_modules/@estee/elc-grid/src/constants/index.ts","webpack://pincer-loyalty/./node_modules/@estee/elc-grid/src/views/Column.tsx","webpack://pincer-loyalty/./node_modules/@estee/elc-accordion/src/views/LabelDetailSlide.tsx","webpack://pincer-loyalty/./src/internal/views/marketing-page/benefits-rewards/BenefitsRewardsPointAccordionWrapper.tsx","webpack://pincer-loyalty/./src/internal/views/marketing-page/benefits-rewards/BenefitsRewards.tsx","webpack://pincer-loyalty/./src/internal/views/marketing-page/dynamic-redirection/DynamicRedirection.tsx","webpack://pincer-loyalty/./src/internal/views/marketing-page/loyalty-hero-section/HeroSection.tsx","webpack://pincer-loyalty/./src/internal/views/marketing-page/loyalty-how-it-works/HowItWorkStepItem.tsx","webpack://pincer-loyalty/./src/internal/utils/gridAreasByItemNumber.ts","webpack://pincer-loyalty/./src/internal/views/marketing-page/loyalty-how-it-works/HowItWorks.tsx","webpack://pincer-loyalty/./src/internal/views/marketing-page/point-benefit/PointBenefit.tsx","webpack://pincer-loyalty/./src/internal/views/marketing-page/tier-benefits/TierBenefits.tsx","webpack://pincer-loyalty/./src/internal/views/marketing-page/registry.ts","webpack://pincer-loyalty/./src/exported/loyalty-marketing-page/LoyaltyMarketingPage.tsx","webpack://pincer-loyalty/./src/internal/hooks/WithStyles.tsx","webpack://pincer-loyalty/./src/internal/utils/Classes.ts","webpack://pincer-loyalty/./src/internal/views/LoyaltyTierDiamond.tsx","webpack://pincer-loyalty/./src/internal/views/dashboard/SliderWrapper.ts","webpack://pincer-loyalty/./src/internal/views/dashboard/loyalty-earn-points/LoyaltyEarnPoints.tsx","webpack://pincer-loyalty/./src/internal/views/dashboard/sections.ts","webpack://pincer-loyalty/./src/service-setup/packageInfo.ts","webpack://pincer-loyalty/./src/styles/ lazy ^\\.\\/.*\\.css$ namespace object"],"sourcesContent":["import * as React from 'react';\n\nexport interface ITab {\n    className?: string;\n    icon?: React.ReactNode;\n    id: string;\n    tabHeaderId?: string;\n    tabPanelId?: string;\n    title: string;\n    subtitle?: string;\n}\n\nexport class Tab extends React.Component<ITab> {\n    public render() {\n        return this.props.children;\n    }\n}\n","export const ContentSpacing = {\n    space2: '2px',\n    space4: '4px',\n    space6: '6px',\n    space8: '8px',\n    space10: '10px',\n    space12: '12px',\n    space16: '16px',\n    space20: '20px',\n    space24: '24px',\n    space28: '28px',\n    space32: '32px',\n    space36: '36px',\n    space40: '40px',\n    space44: '44px',\n    space48: '48px',\n    space60: '60px',\n    space80: '80px',\n    space100: '100px'\n};\n","export interface IBreakpoints {\n    [key: string]: number;\n}\n\nexport const layoutPageContentWidth: number = 1260;\n\nexport const Breakpoints: IBreakpoints = {\n    desktop: 768,\n    largeScreen: 1024,\n    extraLargeScreen: 1200\n};\n\nexport const breakpoint = (brp: string) => (\n    code: TemplateStringsArray,\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    ...placeholders: any[]\n) => {\n    // interleave the code with the placeholders\n    let result = placeholders.reduce((acc, holder, idx) => `${acc}${code[idx]}${holder}`, '');\n\n    // add the code literal\n    result = `${result}${code[code.length - 1]}`;\n\n    return `@media(min-width: ${Breakpoints[brp]}px) {${result}}`;\n};\n","export interface IEmphasisProps {\n    [key: string]: number | string;\n}\n\nexport interface IEmphasis {\n    [key: string]: IEmphasisProps;\n}\n\nexport const Emphasis: IEmphasis = {\n    high: { value: 0.88, className: '' }, // No className because it has emphasis High by default\n    medium: { value: 0.64, className: 'elc-medium-emphasis' },\n    half: { value: 0.5, className: 'elc-half-emphasis' },\n    light: { value: 0.12, className: 'elc-light-emphasis' },\n    pale: { value: 0.02, className: 'elc-pale-emphasis' },\n    disabled: { value: 0.4, className: 'elc-disabled-emphasis' }\n};\n","import { Emphasis } from './Emphasis';\n\nexport interface IColors {\n    black: string;\n    white: string;\n    whiteDove: string;\n    primary900: string;\n    primary800: string;\n    primary700: string;\n    primary600: string;\n    primary500: string;\n    primary400: string;\n    primary300: string;\n    primary200: string;\n    primary100: string;\n    primary50: string;\n    danger: string;\n    info: string;\n    success: string;\n    warning: string;\n    unvisitedLink: string;\n    visitedLink: string;\n    blackHighEmphasis: string;\n    blackMediumEmphasis: string;\n    blackLightEmphasis: string;\n    blackDisabledEmphasis: string;\n    whiteHighEmphasis: string;\n    whiteMediumEmphasis: string;\n    whiteDisabledEmphasis: string;\n    redLightEmphasis: string;\n\n    [key: string]: string;\n}\n\nexport const Colors: IColors = {\n    black: '#000000',\n    white: '#FFFFFF',\n    whiteDove: '#FBFBFB',\n    primary900: '#212121',\n    primary800: '#424242',\n    primary700: '#616161',\n    primary600: '#757575',\n    primary500: '#9E9E9E',\n    primary400: '#BDBDBD',\n    primary300: '#E0E0E0',\n    primary200: '#EEEEEE',\n    primary100: '#F5F5F5',\n    primary50: '#FAFAFA',\n    danger: '#B00020',\n    info: '#54A6D7',\n    success: '#70B000',\n    warning: '#EE9F57',\n    unvisitedLink: '#0000EE',\n    visitedLink: '#551A8B',\n    blackHighEmphasis: `rgba(0, 0, 0, ${Emphasis.high.value})`,\n    blackMediumEmphasis: `rgba(0, 0, 0, ${Emphasis.medium.value})`,\n    blackLightEmphasis: `rgba(0, 0, 0, ${Emphasis.light.value})`,\n    blackDisabledEmphasis: `rgba(0, 0, 0, ${Emphasis.disabled.value})`,\n    blackPaleEmphasis: `rgba(0, 0, 0, ${Emphasis.pale.value})`,\n    whiteHighEmphasis: `rgba(255, 255, 255, ${Emphasis.high.value})`,\n    whiteMediumEmphasis: `rgba(255, 255, 255, ${Emphasis.medium.value})`,\n    whiteDisabledEmphasis: `rgba(255, 255, 255, ${Emphasis.disabled.value})`,\n    redLightEmphasis: `rgba(176, 0, 32, ${Emphasis.pale.value})`,\n    successEmphasis: `rgba(112, 176, 0, ${Emphasis.pale.value})`,\n    warningEmphasis: `rgba(238, 159, 87, ${Emphasis.pale.value})`,\n    successHalfEmphasis: `rgba(112, 176, 0, ${Emphasis.half.value})`,\n    warningHalfEmphasis: `rgba(238, 159, 87, ${Emphasis.half.value})`\n};\n","import { Colors } from '@estee/elc-base-theme';\n\nexport const tabHeaderTheme = `\n    background-color: transparent;\n    border-color: ${Colors.primary300};\n\n    &:hover,\n    &:focus {\n        border-color: ${Colors.black};\n        cursor: pointer;\n    }\n\n    &.elc-tabs__tab--current {\n        border-color: ${Colors.black};\n\n        &:hover,\n        &:focus {\n            cursor: default;\n        }\n    }\n\n    .elc-icon {\n        cursor: inherit;\n    }\n`;\n","import * as React from 'react';\nimport * as classnames from 'classnames';\nimport styled, { StyledComponentBase } from 'styled-components';\nimport { breakpoint, ContentSpacing } from '@estee/elc-base-theme';\nimport { tabHeaderTheme } from '../theme/default-theme';\n\nexport interface ITabHeader {\n    className?: string;\n    icon?: React.ReactNode;\n    isCurrent: boolean;\n    onSelect(currentTabId: string): void;\n    onSelectNext(currentTabId: string): void;\n    onSelectPrevious(currentTabId: string): void;\n    tabHeaderId: string;\n    tabId: string;\n    tabPanelId: string;\n    title: string;\n    subtitle?: string;\n    keepButtonTabOrder?: boolean;\n}\n\nconst StyledTabHeader: StyledComponentBase<'button', ITabHeader> = styled.button`\n    border-style: solid;\n    border-width: 1px;\n    margin: 0 0 ${ContentSpacing.space12};\n    padding: ${ContentSpacing.space16};\n    width: 100%;\n    ${tabHeaderTheme};\n\n    ${breakpoint('desktop')`\n        margin: 0 ${ContentSpacing.space24} ${ContentSpacing.space24} 0;\n        padding: ${ContentSpacing.space28};\n\n        &:last-child {\n            margin-right: 0;\n        }\n\n        [dir='rtl'] & {\n            margin-left  ${ContentSpacing.space24};\n            margin-right  0;\n\n            &:last-child {\n                margin-left: 0;\n            }\n        }\n    `};\n\n    .elc-icon {\n        margin: 0 auto ${ContentSpacing.space10};\n    }\n`;\n\nStyledTabHeader.displayName = 'StyledTabHeader';\n\nexport class TabHeader extends React.Component<ITabHeader> {\n    private tabHeaderRef: React.RefObject<HTMLButtonElement> = React.createRef();\n\n    componentDidUpdate(prevProps: ITabHeader) {\n        if (\n            this.tabHeaderRef.current &&\n            this.props.isCurrent &&\n            prevProps.isCurrent !== this.props.isCurrent\n        ) {\n            this.tabHeaderRef.current.focus();\n        }\n    }\n\n    private onClick = () => {\n        this.props.onSelect(this.props.tabId);\n    };\n\n    private onKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n        if (event.key === 'Right' || event.key === 'ArrowRight') {\n            this.props.onSelectNext(this.props.tabId);\n        }\n\n        if (event.key === 'Left' || event.key === 'ArrowLeft') {\n            this.props.onSelectPrevious(this.props.tabId);\n        }\n    };\n\n    private get tabIndex(): number | undefined {\n        const { isCurrent, keepButtonTabOrder } = this.props;\n        switch (true) {\n            case keepButtonTabOrder:\n                return undefined;\n                break;\n            case isCurrent && !keepButtonTabOrder:\n                return 0;\n                break;\n            case !isCurrent && !keepButtonTabOrder:\n                return -1;\n                break;\n            default:\n                return 0;\n        }\n    }\n\n    public render() {\n        const { icon, isCurrent, tabHeaderId, tabPanelId, title, subtitle, className } = this.props;\n        const classNames = classnames('elc-tabs__tab', 'js-elc-tabs__tab', className, {\n            'elc-tabs__tab--current': isCurrent\n        });\n\n        return (\n            <StyledTabHeader\n                aria-controls={tabPanelId}\n                aria-selected={isCurrent}\n                className={classNames}\n                id={tabHeaderId}\n                ref={this.tabHeaderRef}\n                onClick={this.onClick}\n                onKeyDown={this.onKeyDown}\n                role={'tab'}\n                tabIndex={this.tabIndex}\n            >\n                {icon && <div className=\"elc-tabs__tab-icon js-elc-tabs__tab-icon\">{icon}</div>}\n                <div className=\"elc-tabs__tab-text js-elc-tabs__tab-text\">{title}</div>\n                <div className=\"elc-tabs__tab-subtitle js-elc-tabs__tab-subtitle\">{subtitle}</div>\n            </StyledTabHeader>\n        );\n    }\n}\n","import * as React from 'react';\nimport * as classnames from 'classnames';\n\nexport interface ITabPanel {\n    children: React.ReactNode;\n    isCurrent: boolean;\n    renderAllContent?: boolean;\n    tabHeaderId: string;\n    tabPanelId: string;\n    panelNotTabbable?: boolean;\n}\n\nconst classNames = classnames('elc-tabs__panel', 'js-elc-tabs__panel');\n\nexport const TabPanel = ({\n    children,\n    isCurrent,\n    renderAllContent,\n    tabHeaderId,\n    tabPanelId,\n    panelNotTabbable\n}: ITabPanel) => {\n    return (\n        <div\n            aria-labelledby={tabHeaderId}\n            className={classNames}\n            hidden={!isCurrent}\n            id={tabPanelId}\n            role={'tabpanel'}\n            tabIndex={panelNotTabbable ? undefined : 0}\n        >\n            {!renderAllContent && isCurrent && <>{children}</>}\n\n            {renderAllContent && <>{children}</>}\n        </div>\n    );\n};\n","import * as React from 'react';\nimport * as classnames from 'classnames';\nimport styled from 'styled-components';\nimport { action } from 'mobx';\nimport { breakpoint, ContentSpacing } from '@estee/elc-base-theme';\nimport { TabHeader } from './TabHeader';\nimport { TabPanel } from './TabPanel';\n\nexport interface ITabs {\n    currentTabId: string;\n    className?: string;\n    onSelect?(currentTabId: string): void;\n    renderAllContent?: boolean;\n    panelNotTabbable?: boolean;\n    keepButtonTabOrder?: boolean;\n}\n\nconst StyledTabList = styled.div`\n    margin: 0 0 ${ContentSpacing.space12};\n\n    ${breakpoint('desktop')`\n        display: flex;\n    `};\n`;\n\nconst classNamesTabsList = classnames('elc-tabs__list', 'js-elc-tabs__list');\nconst classNamesTabPanelsWrapper = classnames(\n    'elc-tabs__panels-wrapper',\n    'js-elc-tabs__panels-wrapper'\n);\n\nexport class Tabs extends React.Component<ITabs> {\n    private tabHeaderId: string;\n    private tabPanelId: string;\n\n    constructor(props: ITabs) {\n        super(props);\n\n        const uniqueNumber = new Date().getTime();\n\n        this.tabHeaderId = `elc-tabs__tab-${uniqueNumber}`;\n\n        this.tabPanelId = `elc-tabs__panel-${uniqueNumber}`;\n    }\n\n    @action\n    private onSelect = (currentTabId: string) => {\n        if (this.props.onSelect) {\n            this.props.onSelect(currentTabId);\n        }\n    };\n\n    @action\n    private onSelectNext = (currentTabId: string) => {\n        const tabIds = this.getTabIds();\n\n        const totalTabs = tabIds.length - 1;\n\n        const index = tabIds.findIndex(tabId => tabId === currentTabId);\n\n        this.onSelect(tabIds[index === totalTabs ? 0 : index + 1]);\n    };\n\n    @action\n    private onSelectPrevious = (currentTabId: string) => {\n        const tabIds = this.getTabIds();\n\n        const totalTabs = tabIds.length - 1;\n\n        const index = tabIds.findIndex(tabId => tabId === currentTabId);\n\n        this.onSelect(tabIds[index === 0 ? totalTabs : index - 1]);\n    };\n\n    private getTabIds = () => {\n        return React.Children.map(this.getTabs(), (tab: React.ReactElement) => {\n            if (tab.props && tab.props.id) {\n                return tab.props.id;\n            }\n        });\n    };\n\n    private getTabs = () => {\n        return React.Children.toArray(this.props.children).filter(tab => tab);\n    };\n\n    public render() {\n        const classNamesTabWrapper = classnames('elc-tabs', 'js-elc-tabs', this.props.className);\n\n        const tabs = this.getTabs();\n        const { keepButtonTabOrder } = this.props;\n\n        const tabHeaders = React.Children.map(tabs, (tab: React.ReactElement) => {\n            const { icon, id, tabHeaderId, tabPanelId, title, subtitle, className } = tab.props;\n\n            return (\n                <TabHeader\n                    className={className}\n                    icon={icon}\n                    isCurrent={this.props.currentTabId === id}\n                    onSelect={this.onSelect}\n                    onSelectNext={this.onSelectNext}\n                    onSelectPrevious={this.onSelectPrevious}\n                    tabHeaderId={tabHeaderId || `${this.tabHeaderId}-${id}`}\n                    tabId={id}\n                    tabPanelId={tabPanelId || `${this.tabPanelId}-${id}`}\n                    title={title}\n                    subtitle={subtitle}\n                    keepButtonTabOrder={keepButtonTabOrder}\n                />\n            );\n        });\n\n        const tabPanels = React.Children.map(tabs, (tab: React.ReactElement) => {\n            const { currentTabId, renderAllContent, panelNotTabbable } = this.props;\n            const { children, id, tabHeaderId, tabPanelId } = tab.props;\n\n            return (\n                <TabPanel\n                    children={children}\n                    isCurrent={currentTabId === id}\n                    renderAllContent={renderAllContent}\n                    tabHeaderId={tabHeaderId || `${this.tabHeaderId}-${id}`}\n                    tabPanelId={tabPanelId || `${this.tabPanelId}-${id}`}\n                    panelNotTabbable={panelNotTabbable}\n                />\n            );\n        });\n\n        return (\n            <div className={classNamesTabWrapper}>\n                <StyledTabList className={classNamesTabsList} role=\"tablist\">\n                    {tabHeaders}\n                </StyledTabList>\n                <div className={classNamesTabPanelsWrapper}>{tabPanels}</div>\n            </div>\n        );\n    }\n}\n","export const marketingPageSections = {\n    benefits: 'benefits',\n    benefitsRewards: 'benefitsRewards',\n    dynamicRedirection: 'dynamicRedirection',\n    dynamicRedirectionBanner: 'dynamicRedirectionBanner',\n    dynamicRedirectionFooter: 'dynamicRedirectionFooter',\n    heroSection: 'heroSection',\n    howItWorks: 'howItWorks',\n    loyaltyConfig: 'loyaltyConfig',\n    pointBenefit: 'pointBenefit',\n    tierBenefit: 'tierBenefit',\n    tierBenefits: 'tierBenefits',\n    earnPoints: 'earnPoints'\n};\n","import * as React from 'react';\nimport { observer } from 'mobx-react';\nimport { IBenefitsRewardsTableHeader } from '~views/marketing-page/benefits-rewards/IBenefitsRewards';\nimport { LoyaltyTierDiamond } from '~views/LoyaltyTierDiamond';\nimport styled from 'styled-components';\nimport { classes } from '~utils/Classes';\n\nconst benefitsRewardsTableTableHeading2Class = classes(\n    'loyalty-marketing-page-benefits-rewards__tableHeading2'\n);\nconst benefitsRewardsTableTableHeading3Class = classes(\n    'loyalty-marketing-page-benefits-rewards__tableHeading3'\n);\nconst benefitsRewardsTableTableHeading4Class = classes(\n    'loyalty-marketing-page-benefits-rewards__tableHeading4'\n);\nconst benefitsRewardsTableLevelClass = 'loyalty-marketing-page-benefits-rewards__tableLevelHeader';\n\nconst BenefitsRewardsTableThWrapper = styled.div`\n    display: flex;\n    flex-direction: column;\n`;\n\nconst BenefitsRewardsTableHeading3 = styled.p<{ textColor: string }>`\n    color: ${({ textColor }) => `#${textColor}`};\n    grid-area: benefitsRewardsTableHeading3;\n`;\n\nconst BenefitsRewardsTableHeading4 = styled.p<{ textColor: string }>`\n    color: ${({ textColor }) => `#${textColor}`};\n    grid-area: benefitsRewardsTableHeading4;\n`;\n\nconst BenefitsRewardsTableTh = styled.th<{ backgroundColor: string }>`\n    grid-area: benefitsRewardsTableTh;\n`;\n\nconst BenefitsRewardsTableHeading2 = styled.p<{ textColor: string }>`\n    color: ${({ textColor }) => `#${textColor}`};\n    grid-area: benefitsRewardsTableHeading2;\n`;\n\nconst diamondSize = '10px';\n\nexport const BenefitsRewardsTableHeader = observer(function EarnPointsDetails({\n    tier,\n    levelName,\n    shortDescription,\n    heading,\n    tierColor,\n    textColor\n}: IBenefitsRewardsTableHeader) {\n    return (\n        <BenefitsRewardsTableTh\n            backgroundColor={tierColor.hex}\n            className={benefitsRewardsTableLevelClass}\n        >\n            <BenefitsRewardsTableThWrapper>\n                <LoyaltyTierDiamond\n                    loyaltyTier={tier}\n                    textColor={tierColor.hex}\n                    size={diamondSize}\n                    sign={''}\n                />\n                <BenefitsRewardsTableHeading2\n                    textColor={textColor.hex}\n                    className={benefitsRewardsTableTableHeading2Class}\n                >\n                    {heading}\n                </BenefitsRewardsTableHeading2>\n                <BenefitsRewardsTableHeading3\n                    textColor={textColor.hex}\n                    className={benefitsRewardsTableTableHeading3Class}\n                >\n                    {levelName}\n                </BenefitsRewardsTableHeading3>\n                <BenefitsRewardsTableHeading4\n                    textColor={textColor.hex}\n                    className={benefitsRewardsTableTableHeading4Class}\n                >\n                    {shortDescription}\n                </BenefitsRewardsTableHeading4>\n            </BenefitsRewardsTableThWrapper>\n        </BenefitsRewardsTableTh>\n    );\n});\n","import { observer } from 'mobx-react';\nimport { IBenefitsRewardsTableThead } from '~views/marketing-page/benefits-rewards/IBenefitsRewards';\nimport { BenefitsRewardsTableHeader } from '~views/marketing-page/benefits-rewards/BenefitsRewardsTableHeader';\nimport * as React from 'react';\nimport { classes } from '~utils/Classes';\n\nconst benefitsRewardsTableHeadClass = 'loyalty-marketing-page-benefits-rewards__tableHead';\nconst benefitsRewardsTableLogoWrapperClass = classes(\n    'loyalty-marketing-page-benefits-rewards__table__logoWrapper'\n);\nconst benefitsRewardsTableColumnHeadersClass = classes(\n    'loyalty-marketing-page-benefits-rewards__table__columnHeaders'\n);\n\nexport const BenefitsRewardsTableThead = observer(function BenefitsRewardsTableThead({\n    data,\n    textColor,\n    tableLogo\n}: IBenefitsRewardsTableThead) {\n    return (\n        <thead className={benefitsRewardsTableHeadClass}>\n            <tr className={benefitsRewardsTableColumnHeadersClass}>\n                <th className={benefitsRewardsTableLogoWrapperClass}>\n                    <img src={tableLogo.src} alt={tableLogo.alt} />\n                </th>\n                {data.map((item, index) => (\n                    <BenefitsRewardsTableHeader\n                        heading={item.benefits.heading}\n                        shortDescription={item.benefits.shortDescription}\n                        levelName={item.benefits.levelName}\n                        textColor={textColor}\n                        tierColor={item.benefits.levelColor}\n                        tier={index + 1}\n                        key={index}\n                    />\n                ))}\n            </tr>\n        </thead>\n    );\n});\n","import { observer } from 'mobx-react';\nimport { IBenefitsRewardsMobileItem } from '~views/marketing-page/benefits-rewards/IBenefitsRewards';\nimport * as React from 'react';\nimport { classes } from '~utils/Classes';\nimport styled from 'styled-components';\nimport { LoyaltyTierDiamond } from '~views/LoyaltyTierDiamond';\n\nconst BENEFTIS_REWARDS_ITEM_TEST_ID = 'benefits-rewards-item';\n\nconst benefitsRewardsListItemWrapperClass = classes(\n    'loyalty-marketing-page-benefits-rewards__listItemWrapper'\n);\nconst benefitsRewardsLiClass = classes('loyalty-marketing-page-benefits-rewards__list__item');\nconst benefitsRewardsLiContent = classes(\n    'loyalty-marketing-page-benefits-rewards__list__item__content'\n);\nconst benefitsRewardsTableTableHeading3Class = classes(\n    'loyalty-marketing-page-benefits-rewards__tableHeading3'\n);\nconst benefitsRewardsTableTableHeading4Class = classes(\n    'loyalty-marketing-page-benefits-rewards__tableHeading4'\n);\n\nconst BenefitsRewardsListItemWrapper = styled.div`\n    grid-area: MarketingPageBenefitsRewardsListItem;\n`;\n\nconst BenefitsRewardsTableHeading3 = styled.p<{ textColor: string }>`\n    color: ${({ textColor }) => `#${textColor}`};\n    grid-area: benefitsRewardsTableHeading3;\n`;\n\nconst BenefitsRewardsTableHeading4 = styled.p<{ textColor: string }>`\n    color: ${({ textColor }) => `#${textColor}`};\n    grid-area: benefitsRewardsTableHeading4;\n`;\n\nexport const BenefitsRewardsItem = observer(function EarnPointsDetails({\n    heading,\n    subHeading,\n    sign,\n    tierColor,\n    textColor,\n    tier\n}: IBenefitsRewardsMobileItem) {\n    return (\n        <li className={benefitsRewardsLiClass} data-test-id={BENEFTIS_REWARDS_ITEM_TEST_ID}>\n            <BenefitsRewardsListItemWrapper className={benefitsRewardsListItemWrapperClass}>\n                <LoyaltyTierDiamond loyaltyTier={tier || 0} textColor={tierColor.hex} sign={sign} />\n                <div className={benefitsRewardsLiContent}>\n                    <BenefitsRewardsTableHeading3\n                        textColor={textColor.hex}\n                        className={benefitsRewardsTableTableHeading3Class}\n                    >\n                        {heading}\n                    </BenefitsRewardsTableHeading3>\n                    {subHeading.length > 0 && (\n                        <BenefitsRewardsTableHeading4\n                            textColor={textColor.hex}\n                            className={benefitsRewardsTableTableHeading4Class}\n                        >\n                            {subHeading}\n                        </BenefitsRewardsTableHeading4>\n                    )}\n                </div>\n            </BenefitsRewardsListItemWrapper>\n        </li>\n    );\n});\n","import styled, { StyledComponentBase } from 'styled-components';\n\ninterface IFlexProps {\n    align?: string;\n    flexWrap?: string;\n    className?: string;\n}\ninterface IBoxProps {\n    width?: number[];\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    theme?: any;\n}\n// These are the same defaults as styled-system used to have.\n// Set them like this for backwards compatibility reasons since we've removed reflexbox lib\nconst defaultTheme = {\n    breakpoints: ['40em', '52em', '64em'],\n    fontSizes: [12, 14, 16, 20, 24, 32, 48, 64, 96, 128],\n    space: [0, 4, 8, 16, 32, 64, 128, 256, 512]\n};\n\nconst createMediaQuery = (widths: number[] = []) => (n: string, i: number) =>\n    `@media screen and (min-width: ${n}) { width: ${widths[i + 1] * 100}% }`;\n\nexport const Box: StyledComponentBase<'div', IBoxProps> = styled.div<IBoxProps>`\n    box-sizing: border-box;\n    margin: 0;\n    min-width: 0;\n    width: 100%;\n    ${({ theme = {}, width = [] }) => {\n        const customTheme = { ...defaultTheme, ...theme };\n\n        return customTheme.breakpoints.map(createMediaQuery(width)).join('');\n    }}\n`;\n\nBox.displayName = 'Box';\n\nexport const Flex = styled(Box)<IFlexProps>`\n    display: flex;\n    align-items: ${props => props.align};\n    flex-wrap: ${props => props.flexWrap};\n`;\n","export const GRID_SIZE: number = 12;\n","import * as React from 'react';\nimport * as classnames from 'classnames';\nimport { Box } from './Responsive';\nimport styled, { ThemeProvider } from 'styled-components';\nimport { breakpoint, Breakpoints, ContentSpacing } from '@estee/elc-base-theme';\nimport { GRID_SIZE } from '../constants';\n\nexport interface IBoxProps {\n    className?: string;\n    xs?: number;\n    sm?: number;\n    md?: number;\n    lg?: number;\n    children?: React.ReactNode;\n}\n\nconst mapBreakpointsToArray = (\n    xs: number = 12,\n    sm?: number,\n    md?: number,\n    lg?: number\n): number[] => {\n    const _xs = xs / GRID_SIZE;\n    const _sm = sm ? sm / GRID_SIZE : _xs;\n    const _md = md ? md / GRID_SIZE : _sm;\n    const _lg = lg ? lg / GRID_SIZE : _md;\n\n    return [_xs, _sm, _md, _lg];\n};\n\nconst StyledBox = styled(Box)`\n    padding: 0 ${ContentSpacing.space6};\n    ${breakpoint('desktop')`\n        padding: 0 ${ContentSpacing.space8};\n    `};\n`;\n\nconst theme = {\n    breakpoints: Object.keys(Breakpoints)\n        .sort((a: string, b: string) => Breakpoints[a] - Breakpoints[b])\n        .map((key: string) => `${Breakpoints[key]}px`)\n};\n\nexport class Column extends React.Component<IBoxProps> {\n    public render() {\n        const { className, xs, sm, md, lg, children } = this.props;\n\n        const width = mapBreakpointsToArray(xs, sm, md, lg);\n        const classNames = classnames('js-grid-column', 'elc-grid-column', className);\n\n        return (\n            <ThemeProvider theme={theme}>\n                <StyledBox className={classNames} width={width}>\n                    {children}\n                </StyledBox>\n            </ThemeProvider>\n        );\n    }\n}\n","import * as classnames from 'classnames';\nimport * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { Header, HeaderLabel } from './AccordionStyle';\nimport { Column } from '@estee/elc-grid';\nimport { AccordionIcons } from './AccordionIcons';\n\nexport interface ILabelDetailSlideProps {\n    id: string;\n    title: string;\n    extrainfo: string;\n    className?: string;\n    index?: number;\n    isOpen?: boolean;\n    iconType?: string;\n    dataTestId?: string;\n    onChange?(openIndex: number): void;\n    headerBackgroundColor?: string;\n}\n\nconst LabelDetailDiv = styled.div`\n    margin-left: auto;\n\n    [dir='rtl'] & {\n        margin-left: 8px;\n        margin-right: auto;\n    }\n`;\n\nconst iconCss = css`\n    margin-left: 10px;\n    min-width: 16px;\n\n    [dir='rtl'] & {\n        margin-right: 8px;\n    }\n`;\n\nconst AccordionIconsStyled = styled(AccordionIcons)`\n    ${iconCss};\n`;\n\nconst HeaderWrapper = styled(Header)<{ backgroundColor?: string }>`\n    background-color: ${({ backgroundColor }) => `#${backgroundColor}` || 'transparent'};\n    border: 1px solid;\n`;\n\nexport class LabelDetailSlide extends React.Component<ILabelDetailSlideProps> {\n    constructor(props: ILabelDetailSlideProps) {\n        super(props);\n        this.onClick = this.onClick.bind(this);\n        this.handleHeaderKeyboardAccess = this.handleHeaderKeyboardAccess.bind(this);\n    }\n\n    private onClick(): void {\n        if (this.props.onChange) {\n            this.props.onChange(this.props.index || 0);\n        }\n    }\n\n    private handleHeaderKeyboardAccess(event: React.KeyboardEvent<HTMLDivElement>): void {\n        if (event.key === 'Enter' || event.key === ' ') {\n            this.onClick();\n        }\n    }\n\n    private dislayContent() {\n        if (this.props.isOpen) {\n            return (\n                <Column className=\"elc-radio-slide-content js-radio-slide-content\">\n                    {this.props.children}\n                </Column>\n            );\n        }\n\n        return null;\n    }\n\n    public render() {\n        const labelSlideClass = classnames(\n            this.props.className,\n            'elc-label-slide',\n            'js-label-slide'\n        );\n\n        const isOpen: boolean = this.props.isOpen || false;\n\n        return (\n            <div className={labelSlideClass}>\n                <HeaderWrapper\n                    onClick={this.onClick}\n                    onKeyPress={this.handleHeaderKeyboardAccess}\n                    title={this.props.title}\n                    tabIndex={0}\n                    role=\"tab\"\n                    data-test-id={this.props.dataTestId || ''}\n                    aria-controls={`acc-${this.props.id}`}\n                    aria-expanded={isOpen}\n                    className=\"elc-accordion-header js-accordion-header\"\n                    isOpen={isOpen}\n                    backgroundColor={this.props.headerBackgroundColor}\n                >\n                    <HeaderLabel className=\"elc-header-label js-header-label\">\n                        {this.props.title}\n                    </HeaderLabel>\n                    <AccordionIconsStyled\n                        isOpen={this.props.isOpen}\n                        iconType={this.props.iconType}\n                    />\n                    <LabelDetailDiv className=\"elc-label-detail js-label-detail\">\n                        {this.props.extrainfo}\n                    </LabelDetailDiv>\n                </HeaderWrapper>\n                {this.dislayContent()}\n            </div>\n        );\n    }\n}\n","import { observer } from 'mobx-react';\nimport { IPointAccordionWrapper } from '~views/marketing-page/benefits-rewards/IBenefitsRewards';\nimport { BenefitsRewardsItem } from '~views/marketing-page/benefits-rewards/BenefitsRewardsItem';\nimport * as React from 'react';\nimport styled from 'styled-components';\nimport { Accordion, LabelDetailSlide } from '@estee/elc-accordion';\nimport { classes } from '~utils/Classes';\n\nconst benefitsRewardsAccordionClass = classes('loyalty-marketing-page-benefits-rewards__accordion');\nconst benefitsRewardsLabelSlideClass = classes(\n    'loyalty-marketing-page-benefits-rewards__labelSlide'\n);\nconst benefitsRewardsUlClass = classes('loyalty-marketing-page-benefits-rewards__list');\n\nconst PointAccordion = styled(Accordion)`\n    grid-area: MarketingPageBenefitsRewardsAccordion;\n`;\nconst PointLabelDetailSlide = styled(LabelDetailSlide)`\n    grid-area: MarketingPageBenefitsRewardsDetailSlide;\n`;\n\nexport const BenefitsRewardsPointAccordionWrapper = observer(function PointAccordionWrapper({\n    mapOfItems,\n    textColor,\n    sign\n}: IPointAccordionWrapper) {\n    return (\n        <PointAccordion className={benefitsRewardsAccordionClass}>\n            {mapOfItems.map((item, index) => (\n                <PointLabelDetailSlide\n                    className={benefitsRewardsLabelSlideClass}\n                    id={item.benefits.key}\n                    title={item.benefits.heading}\n                    extrainfo={item.benefits.shortDescription}\n                    iconType=\"arrow\"\n                    key={index}\n                    headerBackgroundColor={item.benefits.levelColor?.hex}\n                >\n                    <ul className={benefitsRewardsUlClass} key={item.benefits.heading}>\n                        {item.labels.map((label) => (\n                            <BenefitsRewardsItem\n                                key={label.key}\n                                tier={index + 1}\n                                tierColor={item.benefits.levelColor}\n                                textColor={textColor}\n                                sign={sign}\n                                heading={label.heading}\n                                subHeading={label.subHeading}\n                            />\n                        ))}\n                    </ul>\n                </PointLabelDetailSlide>\n            ))}\n        </PointAccordion>\n    );\n});\n","import * as React from 'react';\n\nimport { observer } from 'mobx-react';\nimport styled from 'styled-components';\nimport { IBenefitsRewards } from './IBenefitsRewards';\nimport { classes } from '~utils/Classes';\nimport { marketingPageSections as ms } from '~views/marketing-page/sections';\nimport { BenefitsRewardsTableThead } from '~views/marketing-page/benefits-rewards/BenefitsRewardsTableThead';\nimport { BenefitsRewardsPointAccordionWrapper } from '~views/marketing-page/benefits-rewards/BenefitsRewardsPointAccordionWrapper';\nimport { LoyaltyTierDiamond } from '~views/LoyaltyTierDiamond';\n\nexport const TEST_ID_BENEFITS_REWARDS_SECTION = 'loyalty-marketing-page-benefits-rewards';\nconst benefitsRewardsID = 'benefits-rewards';\n\nconst benefitsRewardsClass = classes('loyalty-marketing-page-benefits-rewards');\nconst benefitsRewardsHeaderClass = classes('loyalty-marketing-page-benefits-rewards__header');\nconst benefitsRewardsHeadingClass = classes(\n    'loyalty-marketing-page-benefits-rewards__header__heading'\n);\nconst benefitsRewardsSubheadingClass = classes(\n    'loyalty-marketing-page-benefits-rewards__header__subHeading'\n);\nconst benefitsRewardsFooterClass = classes('loyalty-marketing-page-benefits-rewards__footer');\nconst benefitsRewardsSubFooterClass = classes('loyalty-marketing-page-benefits-rewards__subFooter');\nconst benefitsRewardsLogoClass = classes('loyalty-marketing-page-benefits-rewards__logo');\nconst benefitsRewardsLogoPcClass = classes('loyalty-marketing-page-benefits-rewards__logo__pc');\nconst benefitsRewardsAccordionWrapperClass = classes(\n    'loyalty-marketing-page-benefits-rewards__accordionWrapper'\n);\nconst benefitsRewardsTableWrapperClass = classes(\n    'loyalty-marketing-page-benefits-rewards__tableWrapper'\n);\nconst benefitsRewardsTableTableHeading3Class = classes(\n    'loyalty-marketing-page-benefits-rewards__tableHeading3'\n);\nconst benefitsRewardsTableTableHeading3NoSubheadingClass = classes(\n    'loyalty-marketing-page-benefits-rewards__tableHeading3',\n    'elc-loyalty-marketing-page-benefits-rewards__tableHeading3__noSubheading'\n);\nconst benefitsRewardsTableTableHeading4Class = classes(\n    'loyalty-marketing-page-benefits-rewards__tableHeading4'\n);\nconst benefitsRewardsTableTableNoSubtitle = classes(\n    'loyalty-marketing-page-benefits-rewards__tableHeading4',\n    'elc-loyalty-marketing-page-benefits-rewards__noSubheading'\n);\nconst benefitsRewardsTableClass = classes('loyalty-marketing-page-benefits-rewards__table');\nconst benefitsRewardsTableBodyClass = 'loyalty-marketing-page-benefits-rewards__tableBody';\nconst benefitsRewardsTableImageClass = classes(\n    'loyalty-marketing-page-benefits-rewards__table__backgroundImage'\n);\nconst benefitsRewardsTableBenefitItem = classes(\n    'loyalty-marketing-page-benefits-rewards__table__benefit'\n);\nconst benefitsRewardsTableRowHeadersClass = classes(\n    'loyalty-marketing-page-benefits-rewards__table__rowHeaders'\n);\nconst benefitsRewardsTableDataCellClass = classes(\n    'loyalty-marketing-page-benefits-rewards__table__dataCell'\n);\nconst faqSectionWrapperClass = classes(\n  'loyalty-marketing-page-benefits-rewards__faq__wrapper'\n);\nconst faqSectionClass = classes(\n  'loyalty-marketing-page-benefits-rewards__faq__section'\n);\n\nconst BenefitsRewardsSectionWrapper = styled.div<{\n    textColor: string;\n}>`\n    grid-area: ${ms.benefitsRewards};\n    color: ${({ textColor }) => `#${textColor}`};\n`;\n\nconst BenefitsRewardsTable = styled.table<{ backgroundColor: string | undefined }>`\n    background-color: ${({ backgroundColor }) => `#${backgroundColor}`};\n    grid-area: benefitsRewardsTable;\n`;\nconst BenefitsRewardsTableHeading3 = styled.p<{ textColor: string }>`\n    color: ${({ textColor }) => `#${textColor}`};\n    grid-area: benefitsRewardsTableHeading3;\n`;\nconst BenefitsRewardsTableHeading4 = styled.p<{ textColor: string }>`\n    color: ${({ textColor }) => `#${textColor}`};\n    grid-area: benefitsRewardsTableHeading4;\n`;\nconst BenefitsRewardsHeaderWrapper = styled.div`\n    grid-area: MarketingPageBenefitsRewardsHeader;\n`;\nconst BenefitsRewardsSubheaderWrapper = styled.div`\n    grid-area: MarketingPageBenefitsRewardsSubheader;\n`;\nconst BenefitsRewardsLogoWrapper = styled.div`\n    grid-area: MarketingPageBenefitsRewardsLogo;\n`;\nconst BenefitsRewardsLogoWrapperPC = styled.div`\n    grid-area: MarketingPageBenefitsRewardsLogo;\n`;\nconst BenefitsRewardsFooterWrapper = styled.div`\n    grid-area: MarketingPageBenefitsRewardsFooter;\n`;\nconst BenefitsRewardsSubFooterWrapper = styled.div`\n    grid-area: MarketingPageBenefitsRewardsSubFooter;\n`;\nconst BenefitsRewardsAccordionWrapper = styled.div`\n    grid-area: MarketingPageBenefitsRewardsAccordion;\n`;\nconst BenefitsRewardsTableWrapper = styled.div`\n    grid-area: MarketingPageBenefitsRewardsTable;\n`;\nconst FaqSectionWrapper = styled.div``;\nconst FaqSection = styled.div``;\n\nexport const BenefitsRewards = observer(function BenefitsRewardsSection({\n    benefitsRewards,\n    viewController: { groupBenefitsByTier }\n}: IBenefitsRewards) {\n    const data = groupBenefitsByTier(benefitsRewards.tierLabel, benefitsRewards.listBenefits);\n\n    return (\n        <BenefitsRewardsSectionWrapper\n            className={benefitsRewardsClass}\n            data-test-id={TEST_ID_BENEFITS_REWARDS_SECTION}\n            textColor={benefitsRewards.textColor.hex}\n            id={benefitsRewardsID}\n        >\n            <BenefitsRewardsLogoWrapperPC className={benefitsRewardsLogoPcClass}>\n                <img\n                    src={benefitsRewards.loyaltyBenefitsRewardsImagePc.src}\n                    alt={benefitsRewards.loyaltyBenefitsRewardsImagePc.alt}\n                />\n            </BenefitsRewardsLogoWrapperPC>\n            <div className={benefitsRewardsHeaderClass}>\n                <BenefitsRewardsLogoWrapper className={benefitsRewardsLogoClass}>\n                    <img\n                        src={benefitsRewards.loyaltyBenefitsRewardsLogo.src}\n                        alt={benefitsRewards.loyaltyBenefitsRewardsLogo.alt}\n                    />\n                </BenefitsRewardsLogoWrapper>\n                <BenefitsRewardsHeaderWrapper\n                    className={benefitsRewardsHeadingClass}\n                    dangerouslySetInnerHTML={{ __html: benefitsRewards.heading }}\n                />\n                <BenefitsRewardsSubheaderWrapper\n                    className={benefitsRewardsSubheadingClass}\n                    dangerouslySetInnerHTML={{ __html: benefitsRewards.subHeading }}\n                />\n            </div>\n            <BenefitsRewardsAccordionWrapper className={benefitsRewardsAccordionWrapperClass}>\n                <BenefitsRewardsPointAccordionWrapper\n                    mapOfItems={data}\n                    sign={benefitsRewards.sign}\n                    textColor={benefitsRewards.textColor}\n                />\n            </BenefitsRewardsAccordionWrapper>\n            <BenefitsRewardsTableWrapper className={benefitsRewardsTableWrapperClass}>\n                <BenefitsRewardsTable\n                    backgroundColor={benefitsRewards.sectionBackground.hex}\n                    className={benefitsRewardsTableClass}\n                >\n                    <BenefitsRewardsTableThead\n                        data={data}\n                        textColor={benefitsRewards.textColor}\n                        tableLogo={benefitsRewards.loyaltyBenefitsRewardsTableLogo}\n                    />\n                    <tbody className={benefitsRewardsTableBodyClass}>\n                        {benefitsRewards.listBenefits.map((item, index) => (\n                            <tr className={benefitsRewardsTableRowHeadersClass}>\n                                <th className={benefitsRewardsTableBenefitItem}>\n                                    <BenefitsRewardsTableHeading3\n                                        textColor={benefitsRewards.textColor.hex}\n                                        className={\n                                            item.subHeading.length\n                                                ? benefitsRewardsTableTableHeading3Class\n                                                : benefitsRewardsTableTableHeading3NoSubheadingClass\n                                        }\n                                    >\n                                        {item.heading}\n                                    </BenefitsRewardsTableHeading3>\n                                    <BenefitsRewardsTableHeading4\n                                        textColor={benefitsRewards.textColor.hex}\n                                        className={\n                                            item.subHeading.length\n                                                ? benefitsRewardsTableTableHeading4Class\n                                                : benefitsRewardsTableTableNoSubtitle\n                                        }\n                                    >\n                                        {item.subHeading}\n                                    </BenefitsRewardsTableHeading4>\n                                </th>\n                                <td className={benefitsRewardsTableDataCellClass}>\n                                    {item.levelOne && (\n                                        <LoyaltyTierDiamond\n                                            loyaltyTier={1}\n                                            textColor={\n                                                benefitsRewards.tierLabel[0]?.levelColor?.hex\n                                            }\n                                            sign={benefitsRewards.sign}\n                                        />\n                                    )}\n                                </td>\n                                <td className={benefitsRewardsTableDataCellClass}>\n                                    {item.levelTwo && (\n                                        <LoyaltyTierDiamond\n                                            loyaltyTier={2}\n                                            textColor={\n                                                benefitsRewards.tierLabel[1]?.levelColor?.hex\n                                            }\n                                            sign={benefitsRewards.sign}\n                                        />\n                                    )}\n                                </td>\n                                <td className={benefitsRewardsTableDataCellClass}>\n                                    {item.levelThree && (\n                                        <LoyaltyTierDiamond\n                                            loyaltyTier={3}\n                                            textColor={\n                                                benefitsRewards.tierLabel[2]?.levelColor?.hex\n                                            }\n                                            sign={benefitsRewards.sign}\n                                        />\n                                    )}\n                                </td>\n                                {item.levelFourth ? (\n                                    <td className={benefitsRewardsTableDataCellClass}>\n                                        {item.levelFourth && (\n                                            <LoyaltyTierDiamond\n                                                loyaltyTier={4}\n                                                textColor={\n                                                    benefitsRewards.tierLabel[2]?.levelColor?.hex\n                                                }\n                                                sign={benefitsRewards.sign}\n                                            />\n                                        )}\n                                    </td>\n                                ) : null}\n                            </tr>\n                        ))}\n                    </tbody>\n                </BenefitsRewardsTable>\n            </BenefitsRewardsTableWrapper>\n            <BenefitsRewardsFooterWrapper\n                className={benefitsRewardsFooterClass}\n                dangerouslySetInnerHTML={{ __html: benefitsRewards.footer }}\n            />\n            <BenefitsRewardsSubFooterWrapper\n                className={benefitsRewardsSubFooterClass}\n                dangerouslySetInnerHTML={{ __html: benefitsRewards.subfooter }}\n            />\n            <img\n                className={benefitsRewardsTableImageClass}\n                src={benefitsRewards.sectionBackground.src}\n                alt={benefitsRewards.sectionBackground.alt}\n            />\n            <FaqSectionWrapper className={faqSectionWrapperClass}>\n                <FaqSection className={faqSectionClass}>\n                    <strong>HAVE QUESTIONS?</strong>\n                    <p>&nbsp;</p>\n                    <p className='elc-loyalty-marketing-page-dynamic-redirection elc-loyalty-marketing-page-dynamic-redirection-faq'>\n                      <a href=\"/mac-lover-faqs\">VIEW FAQ</a>\n                    </p>\n                </FaqSection>\n            </FaqSectionWrapper>\n        </BenefitsRewardsSectionWrapper>\n    );\n});\n","import * as React from 'react';\nimport { observer } from 'mobx-react';\nimport { IDynamicRedirection } from './IDynamicRedirection';\nimport styled from 'styled-components';\nimport { Breakpoints } from '@estee/elc-base-theme';\nimport { classes } from '~utils/Classes';\nimport LoyaltyMarketingPageController from '~exported/loyalty-marketing-page/LoyaltyMarketingPageController';\nimport { vulcan_csrf_token } from '~api/LoyaltyApiSdk';\n\nexport const TEST_ID_DYNAMIC_REDIRECTION_SECTION = 'loyalty-marketing-page-dynamic-redirection';\n\nconst DynamicRedirectionBannerClass = classes('dynamic-redirection-program-banner');\nconst DynamicRedirectionClass = classes(\n    'loyalty-marketing-page-dynamic-redirection-section-wrapper'\n);\nconst DynamicRedirectionClassBannerParent = classes(\n    'loyalty-marketing-page-dynamic-redirection-banner-parent'\n);\nconst DynamicRedirectionFormClass = classes('dynamic-redirection-form');\nconst DynamicRedirectionHeaderClass = classes('dynamic-redirection-header');\nconst DynamicRedirectionImageClass = classes('dynamic-redirection-with-image');\nconst DynamicRedirectionImageLoyaltyClass = classes('dynamic-redirection-with-image--loyalty');\nconst DynamicRedirectionJoinWrapperClass = classes('dynamic-redirection-join-wrapper');\nconst DynamicRedirectionJoinButtonClass = classes('dynamic-redirection-join-btn');\nconst DynamicRedirectionMemberClass = classes('dynamic-redirection-member');\nconst DynamicRedirectionProgramNameClass = classes('dynamic-redirection-program-name');\nconst DynamicRedirectionSubheaderClass = classes('dynamic-redirection-subheader');\nconst DynamicRedirectionDescriptionClass = classes('dynamic-redirection-description');\nconst DynamicRedirectionWrapperClass = classes('loyalty-marketing-page-dynamic-redirection');\nconst DynamicRedirectionHeaderWrapperClass = classes('dynamic-redirection-header-wrapper');\n\nconst layout = `\n'redirectionSection bannerImage'`;\n\nconst DynamicRedirectionWrapper = styled.div<{\n    componentType?: string;\n    bannerExists?: boolean;\n    sectionBackgroundColor?: string;\n    sectionTextColor?: string;\n}>`\n    grid-area: ${({ componentType }) => `${componentType}`};\n    background-color: ${({ sectionBackgroundColor }) => `#${sectionBackgroundColor}`};\n    color: ${({ sectionTextColor }) => `#${sectionTextColor}`};\n    ${({ bannerExists }) =>\n        bannerExists\n            ? `\n    @media screen and (min-width: ${Breakpoints.desktop}px) {\n        grid-template-areas: ${layout};\n    }\n    `\n            : ''}\n`;\n\nconst DynamicRedirectionBannerParent = styled.div`\n    grid-area: dynamicRedirectionBanner;\n`;\nconst DynamicRedirectionBannerImage = styled.div`\n    grid-area: bannerImage;\n`;\nconst DynamicRedirectionEmailField = styled.input`\n    grid-area: DynamicRedirectionEmailField;\n`;\nconst DynamicRedirectionForm = styled.form`\n    grid-area: DynamicRedirectionForm;\n`;\nconst DynamicRedirectionHeader = styled.div`\n    grid-area: DynamicRedirectionHeader;\n`;\nconst DynamicRedirectionJoinWrapper = styled.div`\n    grid-area: DynamicRedirectionJoinWrapper;\n`;\n\nconst DynamicRedirectionJoinButton = styled.input`\n    grid-area: DynamicRedirectionJoinButton;\n`;\n\nconst DynamicRedirectionMember = styled.div`\n    grid-area: DynamicRedirectionMember;\n`;\nconst DynamicRedirectionProgramName = styled.div`\n    grid-area: DynamicRedirectionProgramName;\n`;\nconst DynamicRedirectionSectionWrapper = styled.div<{ bannerExists?: boolean }>`\n    grid-area: redirectionSection;\n`;\nconst DynamicRedirectionSubheader = styled.div`\n    grid-area: DynamicRedirectionSubheader;\n`;\nconst DynamicRedirectionDescription = styled.div`\n    grid-area: DynamicRedirectionDescription;\n`;\nconst DynamicRedirectionHeaderWrapper = styled.div``;\n\nexport interface IDynamicRedirectionProps {\n    viewController: LoyaltyMarketingPageController;\n    dynamicRedirection: IDynamicRedirection;\n    type: string;\n}\n\nexport const DynamicRedirection = observer(function DynamicRedirectionSection({\n    dynamicRedirection: {\n        description,\n        emailPlaceholder,\n        guestButton,\n        loyaltyBannerImage,\n        loyaltyButton,\n        loyaltyHeader,\n        loyaltyMemberSignIn,\n        loyaltyProgramName,\n        nonLoyaltyHeader,\n        onlineButton,\n        sectionBackgroundColor,\n        sectionButtonColors,\n        sectionTextColor,\n        subheader\n    },\n    viewController: {\n        data: { isLoyaltyUser, isOnlineUser }\n    },\n    type\n}: IDynamicRedirectionProps) {\n    const buttonState = isLoyaltyUser ? loyaltyButton : isOnlineUser ? onlineButton : guestButton;\n    const headerState = isLoyaltyUser ? loyaltyHeader : nonLoyaltyHeader;\n    const isGuestUser = !isOnlineUser && !isLoyaltyUser;\n    const isNonLoyaltyUser = !isLoyaltyUser;\n    const displaySubheader = !!subheader?.length;\n    const displayDescription = !!description?.length;\n    const bannerExists = !!loyaltyBannerImage?.src?.length;\n\n    return bannerExists ? (\n        <DynamicRedirectionBannerParent className={DynamicRedirectionClassBannerParent}>\n            <DynamicRedirectionWrapper\n                bannerExists\n                className={`${DynamicRedirectionWrapperClass} ${DynamicRedirectionImageClass} ${\n                    isLoyaltyUser ? DynamicRedirectionImageLoyaltyClass : ''\n                }`}\n                sectionBackgroundColor={sectionBackgroundColor.hex}\n                sectionTextColor={sectionTextColor.hex}\n            >\n                <DynamicRedirectionSectionWrapper\n                    bannerExists={bannerExists}\n                    className={DynamicRedirectionClass}\n                    data-test-id={TEST_ID_DYNAMIC_REDIRECTION_SECTION}\n                >\n                    <DynamicRedirectionProgramName className={DynamicRedirectionProgramNameClass}>\n                        {loyaltyProgramName}\n                    </DynamicRedirectionProgramName>\n                    <DynamicRedirectionHeaderWrapper className={DynamicRedirectionHeaderWrapperClass}>\n                        <DynamicRedirectionHeader\n                            className={DynamicRedirectionHeaderClass}\n                            dangerouslySetInnerHTML={{ __html: headerState }}\n                        />\n                        {displaySubheader && (\n                            <DynamicRedirectionSubheader\n                                className={DynamicRedirectionSubheaderClass}\n                                dangerouslySetInnerHTML={{ __html: subheader }}\n                            />\n                        )}\n                    </DynamicRedirectionHeaderWrapper>\n                    <DynamicRedirectionForm\n                        method=\"POST\"\n                        action={buttonState.url}\n                        className={DynamicRedirectionFormClass}\n                    >\n                        {isGuestUser && (\n                            <DynamicRedirectionEmailField\n                                type=\"email\"\n                                placeholder={emailPlaceholder}\n                                name=\"LOYALTY_EMAIL_ADDRESS\"\n                            ></DynamicRedirectionEmailField>\n                        )}\n                        <input type=\"hidden\" name=\"LOYALTY_ENROLLMENT\" value={type} />\n                        {vulcan_csrf_token && (<input type=\"hidden\" name=\"_csrf_token\" value={vulcan_csrf_token} />)}\n                        {isNonLoyaltyUser && displayDescription && (\n                            <DynamicRedirectionDescription\n                                className={DynamicRedirectionDescriptionClass}\n                                dangerouslySetInnerHTML={{ __html: description }}\n                            />\n                        )}\n                        <DynamicRedirectionJoinWrapper\n                            className={DynamicRedirectionJoinWrapperClass}\n                        >\n                            <DynamicRedirectionJoinButton\n                                className={DynamicRedirectionJoinButtonClass}\n                                title={buttonState.label}\n                                type=\"submit\"\n                                style={{backgroundColor: `#${sectionButtonColors.backgroundColor}`, color: `#${sectionButtonColors.color}`}}\n                                value={buttonState.label}\n                            />\n                        </DynamicRedirectionJoinWrapper>\n                    </DynamicRedirectionForm>\n                    {isGuestUser && (\n                        <DynamicRedirectionMember\n                            className={DynamicRedirectionMemberClass}\n                            dangerouslySetInnerHTML={{ __html: loyaltyMemberSignIn }}\n                        />\n                    )}\n                </DynamicRedirectionSectionWrapper>\n                <DynamicRedirectionBannerImage className={DynamicRedirectionBannerClass}>\n                    <div className='banner-image' />\n                </DynamicRedirectionBannerImage>\n            </DynamicRedirectionWrapper>\n        </DynamicRedirectionBannerParent>\n    ) : (\n        <DynamicRedirectionWrapper\n            componentType={type}\n            className={DynamicRedirectionWrapperClass}\n            sectionBackgroundColor={sectionBackgroundColor.hex}\n            sectionTextColor={sectionTextColor.hex}\n        >\n            <DynamicRedirectionSectionWrapper\n                bannerExists={bannerExists as boolean}\n                className={DynamicRedirectionClass}\n                data-test-id={TEST_ID_DYNAMIC_REDIRECTION_SECTION}\n            >\n                <DynamicRedirectionProgramName className={DynamicRedirectionProgramNameClass}>\n                    {loyaltyProgramName}\n                </DynamicRedirectionProgramName>\n                <DynamicRedirectionHeader\n                    className={DynamicRedirectionHeaderClass}\n                    dangerouslySetInnerHTML={{ __html: headerState }}\n                />\n                {displaySubheader && (\n                    <DynamicRedirectionSubheader\n                        className={DynamicRedirectionSubheaderClass}\n                        dangerouslySetInnerHTML={{ __html: subheader }}\n                    />\n                )}\n                <DynamicRedirectionForm\n                    method=\"POST\"\n                    action={buttonState.url}\n                    className={DynamicRedirectionFormClass}\n                >\n                    {isGuestUser && (\n                        <DynamicRedirectionEmailField\n                            type=\"email\"\n                            placeholder={emailPlaceholder}\n                            name=\"LOYALTY_EMAIL_ADDRESS\"\n                        ></DynamicRedirectionEmailField>\n                    )}\n                    <input type=\"hidden\" name=\"LOYALTY_ENROLLMENT\" value={type} />\n                    {vulcan_csrf_token && (<input type=\"hidden\" name=\"_csrf_token\" value={vulcan_csrf_token} />)}\n                    {isNonLoyaltyUser && displayDescription && (\n                        <DynamicRedirectionDescription\n                            className={DynamicRedirectionDescriptionClass}\n                            dangerouslySetInnerHTML={{ __html: description }}\n                        />\n                    )}\n                    <DynamicRedirectionJoinWrapper className={DynamicRedirectionJoinWrapperClass}>\n                        <DynamicRedirectionJoinButton\n                            className={DynamicRedirectionJoinButtonClass}\n                            title={buttonState.label}\n                            style={{backgroundColor: `#${sectionButtonColors.backgroundColor}`, color: `#${sectionButtonColors.color}`}}\n                            type=\"submit\"\n                            value={buttonState.label}\n                        />\n                    </DynamicRedirectionJoinWrapper>\n                </DynamicRedirectionForm>\n                {isGuestUser && (\n                    <DynamicRedirectionMember\n                        className={DynamicRedirectionMemberClass}\n                        dangerouslySetInnerHTML={{ __html: loyaltyMemberSignIn }}\n                    />\n                )}\n            </DynamicRedirectionSectionWrapper>\n        </DynamicRedirectionWrapper>\n    );\n});\n","import * as React from 'react';\n\nimport { observer } from 'mobx-react';\nimport styled from 'styled-components';\n\nimport { ILoyaltyHeroSection } from './ILoyaltyHeroSection';\nimport { classes } from '~utils/Classes';\nimport { marketingPageSections as ms } from '~views/marketing-page/sections';\n\nconst HeroSectionWrapper = styled.div<{\n    logoPosition: number;\n    backgroundColor: string;\n    imgUrl: string;\n}>`\n    grid-area: ${ms.heroSection};\n    background-color: ${({ backgroundColor }) => `#${backgroundColor}`};\n    background-image: url('${({ imgUrl }) => `${imgUrl}`}');\n`;\n\nconst HeroSectionLogoWrapper = styled.div``;\n\nconst HeroSectionTextLinesWrapper = styled.div``;\n\nexport const TEST_ID_HERO_SECTION = 'loyalty-marketing-page-hero-section';\nconst heroSectionClass = classes('hero-section');\nconst heroSectionLogoClass = classes('hero-section-logo');\nconst heroSectionImageLogoClass = classes('hero-section-logo__image');\nconst heroSectionTextLinesClass = classes('hero-section-text-lines');\n\nexport const HeroSection = observer(function HeroSection({ heroSection }: ILoyaltyHeroSection) {\n    const classNames = `${heroSectionClass}`;\n    const imageUrl = heroSection.loyaltyHeroSectionBackground.src ? heroSection.loyaltyHeroSectionBackground.src : '';\n\n    return (\n        <>\n            <HeroSectionWrapper\n                className={classNames}\n                data-test-id={TEST_ID_HERO_SECTION}\n                logoPosition={heroSection.loyaltyHeroLogoPosition}\n                backgroundColor={heroSection.loyaltyHeroSectionBackground.hex}\n                imgUrl={imageUrl}\n            >\n                <HeroSectionLogoWrapper className={heroSectionLogoClass}>\n                    <img\n                        className={heroSectionImageLogoClass}\n                        src={heroSection.loyaltyHeroLogo.src}\n                        alt={heroSection.loyaltyHeroLogo.alt}\n                    />\n                </HeroSectionLogoWrapper>\n                <HeroSectionTextLinesWrapper className={heroSectionTextLinesClass}>\n                    {heroSection.textLines.map(({ textLine }, index) => (\n                        <p key={textLine}>{textLine}</p>\n                    ))}\n                </HeroSectionTextLinesWrapper>\n            </HeroSectionWrapper>\n        </>\n    );\n});\n","import * as React from 'react';\nimport { observer } from 'mobx-react';\nimport styled from 'styled-components';\nimport { IHowItWorksStepIdentifier, IHowItWorksStepItem } from './ILoyaltyHowItWorks';\nimport { classes } from '~utils/Classes';\n\nexport const TEST_ID_HOW_IT_WORKS_ITEM = 'how-it-works-step-item';\nconst howItWorksItemWrapperClass = classes('how-it-works-step-item');\nconst howItWorksStepIdentifierClass = classes('how-it-works-step-identifier');\nconst howItWorksStepNameClass = classes('how-it-works-step-name');\nconst howItWorksStepNumberClass = classes('how-it-works-step-number');\nconst howItWorksStepDescriptionClass = classes('how-it-works-step-desc');\nconst howItWorksStepDescriptionParagraphClass = classes('how-it-works-step-desc-paragraph');\n\n// prettier-ignore\nconst HowItWorksItemWrapper = styled.div<{ index: number }>`\n    grid-area: StepItem${({ index }) => index};\n`;\n\nconst HowItWorksStepImage = styled.img`\n    width: 100%;\n    height: 100%;\n`;\n\nconst HowItWorksStepIdentifier = observer((props: IHowItWorksStepIdentifier) => {\n    const { exitingImage, stepNumber, stepImage } = props;\n\n    return exitingImage ? (\n        <HowItWorksStepImage {...stepImage} />\n    ) : (\n        <p className={howItWorksStepNumberClass}>{stepNumber}</p>\n    );\n});\n\nconst HowItWorksStepItem = observer(function HowItWorksItem(props: IHowItWorksStepItem) {\n    const { stepNumber, stepImage, stepName, stepDescription, itemNumber } = props.data;\n    const exitingImage = !!stepImage?.src?.length;\n\n    return (\n        <HowItWorksItemWrapper\n            index={itemNumber}\n            data-test-id={TEST_ID_HOW_IT_WORKS_ITEM}\n            className={howItWorksItemWrapperClass}\n        >\n            <div className={howItWorksStepIdentifierClass}>\n                <HowItWorksStepIdentifier exitingImage={exitingImage} stepNumber={stepNumber} />\n            </div>\n            <div className={howItWorksStepNameClass}>\n                <p className={howItWorksStepDescriptionParagraphClass}>{stepName}</p>\n            </div>\n            <div className={howItWorksStepDescriptionClass}>\n                <p className={howItWorksStepDescriptionParagraphClass}>{stepDescription}</p>\n            </div>\n        </HowItWorksItemWrapper>\n    );\n});\n\nexport default HowItWorksStepItem as React.FC<IHowItWorksStepItem>;\nexport { HowItWorksStepItem };\n","const printAreasByItemNumber = (itemNr: number) => {\n    let areaDef = '';\n    if (itemNr < 3) {\n        for (let i = 0; i < itemNr; i++) {\n            areaDef += `StepItem${i} `;\n        }\n\n        return areaDef;\n    }\n    const maxItemColumns = itemNr % 4 === 3 || itemNr % 4 === 0 ? 4 : 3;\n\n    for (let i = 0; i < itemNr / maxItemColumns; i++) {\n        const itemsLeft = itemNr - maxItemColumns * i;\n        let maxColumnsInRow = maxItemColumns * 2;\n        if (i > 0) {\n            areaDef += '\\n';\n        }\n        areaDef += '\"';\n        if (itemsLeft < maxItemColumns) {\n            areaDef += '. ';\n            maxColumnsInRow -= 2;\n        }\n        for (let j = 0; j < maxColumnsInRow; j++) {\n            areaDef += `StepItem${Math.trunc(j / 2) + i * maxItemColumns} `;\n        }\n        if (itemsLeft < maxItemColumns) {\n            areaDef += '.';\n        }\n\n        areaDef += '\"';\n    }\n\n    return areaDef;\n};\n\nexport default printAreasByItemNumber;\n","import * as React from 'react';\n\nimport { observer } from 'mobx-react';\nimport styled from 'styled-components';\n\nimport { ILoyaltyHowItWorks } from './ILoyaltyHowItWorks';\nimport HowItWorksStepItem from './HowItWorkStepItem';\nimport { classes } from '~utils/Classes';\nimport printAreasByItemNumber from '~utils/gridAreasByItemNumber';\nimport { marketingPageSections as ms } from '~views/marketing-page/sections';\n\nexport const TEST_ID_HOW_IT_WORKS = 'loyalty-marketing-page-how-it-works';\nconst howItWorksWrapperClass = classes('loyalty-marketing-page-how-it-works-wrapper');\nconst howItWorksClass = classes('loyalty-marketing-page-how-it-works');\nconst howItWorksHeaderClass = classes('how-it-works-header');\nconst howItWorksSubheaderClass = classes('how-it-works-subheader');\nconst howItWorksStepsClass = classes('how-it-works-step-wrapper');\n\nconst HowItWorksWrapper = styled.div<{ backgroundColor: string; textColor: string }>`\n    grid-area: ${ms.howItWorks};\n    background-color: ${({ backgroundColor }) => `#${backgroundColor}`};\n    color: ${({ textColor }) => `#${textColor}`};\n`;\nconst HowItWorksSectionWrapper = styled.div`\n    grid-area: HowItWorksSectionWrapper;\n`;\n\nconst HowItWorksHeaderWrapper = styled.div`\n    grid-area: MarketingPageHowItWorksHeader;\n`;\n\nconst HowItWorksSubheaderWrapper = styled.div`\n    grid-area: MarketingPageHowItWorksSubheader;\n`;\n\nconst HowItWorksStepsWrapper = styled.div<{ stepsItems: number }>`\n    display: grid;\n    grid-template-areas: ${({ stepsItems }) => printAreasByItemNumber(stepsItems)};\n    justify-items: center;\n`;\n\nexport const HowItWorks = observer(function HowItWorksSection({ howItWorks }: ILoyaltyHowItWorks) {\n    return (\n        <HowItWorksWrapper\n            data-test-id={TEST_ID_HOW_IT_WORKS}\n            backgroundColor={howItWorks.sectionBackground.hex}\n            textColor={howItWorks.textColor.hex}\n            className={howItWorksWrapperClass}\n        >\n            <HowItWorksSectionWrapper className={howItWorksClass}>\n                <HowItWorksHeaderWrapper\n                    className={howItWorksHeaderClass}\n                    dangerouslySetInnerHTML={{ __html: howItWorks.header }}\n                />\n                <HowItWorksSubheaderWrapper\n                    className={howItWorksSubheaderClass}\n                    dangerouslySetInnerHTML={{ __html: howItWorks.subheader }}\n                />\n                <HowItWorksStepsWrapper\n                    className={howItWorksStepsClass}\n                    stepsItems={howItWorks.stepsItems.length}\n                >\n                    {howItWorks.stepsItems.map((val, index) => (\n                        <HowItWorksStepItem key={val.stepNumber} data={val} />\n                    ))}\n                </HowItWorksStepsWrapper>\n            </HowItWorksSectionWrapper>\n        </HowItWorksWrapper>\n    );\n});\n","import * as React from 'react';\n\nimport { observer } from 'mobx-react';\nimport styled from 'styled-components';\nimport { marketingPageSections as ms } from '~views/marketing-page/sections';\nimport { LOYALTY_POINT_BENEFIT } from '@estee/elc-service-view-names';\nimport { serviceName } from '~setup/packageInfo';\nimport { ServiceView } from '@estee/elc-service';\nimport { IPosition } from '~views/components/interfaces';\nimport { IPointBenefit } from '~views/marketing-page/point-benefit/IPointBenefit';\n\nconst TierBenefitSectionWrapper = styled.div`\n    grid-area: ${ms.pointBenefit};\n`;\n\nexport const TEST_ID_HERO_SECTION = 'loyalty-marketing-page-point-benefit-section';\nexport const TEST_ID_OFFER_DETAILS_POINTS = 'offer-details-points';\n\nexport interface IPointBenefitView extends IPosition {\n    pointBenefit: IPointBenefit;\n}\n\nexport const PointBenefit = observer(function TierBenefit(section: IPointBenefitView) {\n    return (\n        <TierBenefitSectionWrapper>\n            <ServiceView name={LOYALTY_POINT_BENEFIT} serviceName={serviceName} config={section} />\n        </TierBenefitSectionWrapper>\n    );\n});\n","import * as React from 'react';\nimport { observer } from 'mobx-react';\nimport { StyledSlider } from '~views/dashboard/SliderWrapper';\nimport { ISliderSettings } from '@estee/elc-slider';\nimport { IBenefit, ITierBenefits } from './ITierBenefits';\nimport { toFloat } from '~utils/CaseUtils';\nimport styled from 'styled-components';\nimport { classes } from '~utils/Classes';\nimport { marketingPageSections as ms } from '~views/marketing-page/sections';\nimport { Breakpoints } from '@estee/elc-base-theme';\nimport { Tab, Tabs } from '@estee/elc-tabs';\n\nexport const TEST_ID_TIER_BENEFITS = 'loyalty-marketing-tier-benefits';\nexport const TEST_ID_TIER_BENEFITS_ITEM = 'loyalty-marketing-tier-benefits-item';\nconst tierBenefitsWrapperClass = classes('tier-benefits-wrapper');\nconst headingSectionClass = classes('tier-benefits-heading');\nconst headingWrapperClass = classes('tier-benefits-header');\nconst subHeadingWrapperClass = classes('tier-benefits-subheader');\nconst tierBenefitsSliderClass = classes('tier-benefits-slider');\nconst benefitItemClass = classes('tier-benefits-item');\nconst benefitItemImageClass = classes('tier-benefits-item-image');\nconst benefitItemDetailsClass = classes('tier-benefits-item-details');\nconst benefitItemTitleClass = classes('tier-benefits-item-details-title');\nconst benefitItemDescriptionClass = classes('tier-benefits-item-details-description');\n\nconst TierBenefitsWrapper = styled.div<{ backgroundColor: string; color: string }>`\n    grid-area: ${ms.tierBenefits};\n    background-color: ${({ backgroundColor }) => `#${backgroundColor}`};\n    color: ${({ color }) => `#${color}`};\n`;\nconst TierBenefitsWrapperInner = styled.div``;\nconst HeadingSection = styled.div``;\nconst HeadingWrapper = styled.div``;\nconst SubheadingWrapper = styled.div``;\nconst SliderWrapper = styled.div`\n    grid-area: tierBenefitsSliderWrapper;\n`;\nconst ItemWrapper = styled.div<{ color: string }>`\n    color: ${({ color }) => `#${color}`};\n`;\n\nconst BenefitImage = styled.div``;\nconst BenefitTitle = styled.div``;\nconst BenefitDescription = styled.div``;\nconst TabsWrapper = styled.div``;\nconst TabHeader = styled(Tabs)<{ color: string; inactiveColor: string }>`\n    display: block;\n\n    .elc-tabs__tab > div {\n        color: ${({ inactiveColor }) => `#${inactiveColor}`};\n    }\n\n    .elc-tabs__tab--current > div {\n        color: ${({ color }) => `#${color}`};\n    }\n`;\n\nconst TabContent = styled(Tab)`\n    display: block;\n`;\nconst tabsWrapperClass = classes('tier-benefits-tabs-wrapper');\nconst tierBenefitsWrapperInner = classes('tier-benefits-wrapper-inner');\n\nexport const BenefitItem = observer(function BenefitItem({\n    benefitImage: { alt, src },\n    key,\n    title,\n    description,\n    cardTextColor\n}: IBenefit & { cardTextColor: string }) {\n    return (\n        <ItemWrapper\n            key={`${key}-image`}\n            className={benefitItemClass}\n            data-test-id={TEST_ID_TIER_BENEFITS_ITEM}\n            color={cardTextColor}\n        >\n            <BenefitImage className={benefitItemImageClass}>\n                <img src={src} alt={alt} className={benefitItemImageClass} />\n            </BenefitImage>\n            <div className={benefitItemDetailsClass}>\n                <BenefitTitle className={benefitItemTitleClass}>{title}</BenefitTitle>\n                <BenefitDescription className={benefitItemDescriptionClass}>\n                    {description}\n                </BenefitDescription>\n            </div>\n        </ItemWrapper>\n    );\n});\n\nexport const TierBenefits = observer(function TierBenefitsSection({ tierBenefits }: ITierBenefits) {\n    const {\n        header,\n        subHeader,\n        tierBenefitsBackgroundColor,\n        color,\n        inactiveTabsColor,\n        cardTextColor,\n        slider,\n        noOfSliderCards,\n        noOfCardsMovement,\n        tiers,\n        disableTabs\n    } = tierBenefits;\n    const sliderCount = toFloat(noOfSliderCards?.text) || 4;\n    const cardMovementCount = toFloat(noOfCardsMovement?.text) || 4;\n    const [currentTabId, setCurrentTabId] = React.useState<string>('1');\n\n    const benefitItems = tiers?.map(({ key, name }) => {\n        const filteredBenefits = slider\n            .filter((benefit) => benefit.tiers.includes(key))\n            .map((benefitItem: IBenefit) => {\n                return <BenefitItem {...benefitItem} cardTextColor={cardTextColor.hex} />;\n            });\n\n        const infinitySlider = filteredBenefits.length >= sliderCount;\n        const sliderInfiniteSettings: ISliderSettings = {\n            dots: false,\n            arrows: true,\n            slidesToShow: sliderCount,\n            slidesToScroll: cardMovementCount,\n            accessibility: true,\n            infinite: infinitySlider,\n            responsive: [\n                {\n                    breakpoint: Breakpoints.largeScreen,\n                    settings: {\n                        slidesToShow: sliderCount > 3 ? 3 : sliderCount,\n                        slidesToScroll: cardMovementCount > 3 ? 3 : cardMovementCount\n                    }\n                },\n                {\n                    breakpoint: 980,\n                    settings: {\n                        slidesToShow: sliderCount > 2 ? 2 : sliderCount,\n                        slidesToScroll: cardMovementCount > 2 ? 2 : cardMovementCount\n                    }\n                },\n                {\n                    breakpoint: 600,\n                    settings: {\n                        slidesToShow: sliderCount > 2 ? 1.5 : 1,\n                        slidesToScroll: cardMovementCount,\n                        centerMode: false,\n                        dots: true,\n                        arrows: false\n                    }\n                }\n            ],\n            lazyload: true\n        };\n\n        return disableTabs ? (\n            <SliderWrapper>\n                <StyledSlider\n                    className={tierBenefitsSliderClass}\n                    items={filteredBenefits}\n                    sliderSettings={sliderInfiniteSettings}\n                />\n            </SliderWrapper>\n        ) : (\n            <TabContent key={key} id={`${key}`} title={name}>\n                <SliderWrapper>\n                    <StyledSlider\n                        className={tierBenefitsSliderClass}\n                        items={filteredBenefits}\n                        sliderSettings={sliderInfiniteSettings}\n                    />\n                </SliderWrapper>\n            </TabContent>\n        );\n    });\n\n    return (\n        <TierBenefitsWrapper\n            backgroundColor={tierBenefitsBackgroundColor.hex}\n            color={color.hex}\n            className={tierBenefitsWrapperClass}\n            data-test-id={TEST_ID_TIER_BENEFITS}\n        >\n            <TierBenefitsWrapperInner className={tierBenefitsWrapperInner}>\n                <HeadingSection className={headingSectionClass}>\n                    <HeadingWrapper className={headingWrapperClass}>{header}</HeadingWrapper>\n                    <SubheadingWrapper\n                        className={subHeadingWrapperClass}\n                        dangerouslySetInnerHTML={{ __html: subHeader }}\n                    />\n                </HeadingSection>\n                <TabsWrapper className={tabsWrapperClass}>\n                    {disableTabs ? (\n                        benefitItems\n                    ) : (\n                        <TabHeader\n                            currentTabId={currentTabId}\n                            onSelect={setCurrentTabId}\n                            inactiveColor={inactiveTabsColor.hex}\n                            color={color.hex}\n                        >\n                            {benefitItems}\n                        </TabHeader>\n                    )}\n                </TabsWrapper>\n            </TierBenefitsWrapperInner>\n        </TierBenefitsWrapper>\n    );\n});\n","/* eslint-disable @typescript-eslint/ban-types */\nimport * as features from './features';\nimport { marketingPageSections as ms } from './sections';\nimport { loadOnDemand } from '~utils/loadOnDemand';\nimport {\n    ILoyaltyMarketingPage,\n    LoyaltyMarketingConfig\n} from '~exported/loyalty-marketing-page/ILoyaltyMarketingPage';\nimport LoyaltyMarketingPageController from '~exported/loyalty-marketing-page/LoyaltyMarketingPageController';\n\nexport interface IMarketingPageFeature {\n    controller: ILoyaltyMarketingPage['viewController'];\n    componentConfig?: LoyaltyMarketingConfig\n    children?: JSX.Element | JSX.Element[];\n}\n\nexport function loadFeatureOnDemand(\n    feature: Function,\n    componentConfig: LoyaltyMarketingConfig | undefined,\n    controller: LoyaltyMarketingPageController,\n    paramsKey: string\n) {\n    const params = componentConfig?.[paramsKey]?.params || {};\n    const config = componentConfig?.[paramsKey] || {};\n\n    return loadOnDemand(feature, { ...params, viewController: controller, ...config });\n}\n\nexport const getMarketingPageViewRegistry = (featureConfig: IMarketingPageFeature) => {\n    const { componentConfig, controller } = featureConfig;\n\n    return {\n        [ms.heroSection]: loadOnDemand(\n            features.HeroSection,\n            componentConfig?.[ms.heroSection]?.params\n        ),\n        [ms.dynamicRedirection]: loadFeatureOnDemand(\n            features.DynamicRedirection,\n            componentConfig,\n            controller,\n            ms.dynamicRedirection\n        ),\n        [ms.dynamicRedirectionBanner]: loadFeatureOnDemand(\n            features.DynamicRedirection,\n            componentConfig,\n            controller,\n            ms.dynamicRedirectionBanner\n        ),\n        [ms.dynamicRedirectionFooter]: loadFeatureOnDemand(\n            features.DynamicRedirection,\n            componentConfig,\n            controller,\n            ms.dynamicRedirectionFooter\n        ),\n        [ms.pointBenefit]: loadOnDemand(\n            features.PointBenefit,\n            componentConfig?.[ms.pointBenefit]?.params\n        ),\n        [ms.benefitsRewards]: loadFeatureOnDemand(\n            features.BenefitsRewards,\n            componentConfig,\n            controller,\n            ms.benefitsRewards\n        ),\n        [ms.howItWorks]: loadOnDemand(\n            features.HowItWorks,\n            componentConfig?.[ms.howItWorks]?.params\n        ),\n        [ms.tierBenefits]: loadOnDemand(\n            features.TierBenefits,\n            componentConfig?.[ms.tierBenefits]?.params\n        ),\n        [ms.earnPoints]: loadOnDemand(\n            features.LoyaltyEarnPoints,\n            componentConfig?.earnPoints?.params\n        )\n    };\n};\n","import * as React from 'react';\n\nimport { observer } from 'mobx-react';\nimport styled from 'styled-components';\n\nimport { ArrayMinOne } from '@estee/elc-universal-utils';\nimport {\n    getMarketingPageViewRegistry,\n    IMarketingPageFeature\n} from '~views/marketing-page/registry';\nimport { serviceName } from '~setup/packageInfo';\nimport { Breakpoints, ContentSpacing } from '@estee/elc-base-theme';\nimport { ILoyaltyLayouts } from '~views/components/interfaces';\nimport { OrderRender } from '@estee/elc-layouts';\n\nimport { classes } from '~utils/Classes';\nimport { ILoyaltyMarketingPage } from '~exported/loyalty-marketing-page/ILoyaltyMarketingPage';\nimport { Spinner } from '@estee/elc-spinner';\nimport WithStyles from 'src/internal/hooks/WithStyles';\n\nexport const TEST_ID_LOYALTY_MARKETING = 'loyalty-marketing-page';\nexport const TEST_ID_LOYALTY_MARKETING_SPINNER = 'loyalty-marketing-spinner';\nconst loyaltyMarketingPageClass = classes('loyalty-marketing-page', 'brand-specific');\nconst loyaltyMarketingPageClassNonLoyalty = classes(\n    'loyalty-marketing-page',\n    'brand-specific',\n    'non-loyalty-user'\n);\n\nexport const loyaltyConfigs: ArrayMinOne<string> = ['loyaltyMarketingPageConfig'];\n\nconst LoyaltyMarketingPageWrapper = styled.div<ILoyaltyLayouts>`\n    --desktop-max-width: 1920px;\n    --container-column-gap: ${ContentSpacing.space16};\n    --container-row-gap: ${ContentSpacing.space40};\n\n    .fullbleed {\n        grid-column: 1/-1;\n    }\n\n    display: grid;\n    grid-auto-flow: dense;\n    grid-template-areas: ${({ smallLayout }) => smallLayout};\n    column-gap: 0;\n\n    @media screen and (min-width: ${Breakpoints.desktop}px) {\n        grid-template-areas: ${({ largeLayout }) => largeLayout};\n        column-gap: var(--container-column-gap);\n        grid-template-columns:\n            calc(50% - (var(--desktop-max-width) / 2))\n            repeat(6, 1fr)\n            calc(50% - (var(--desktop-max-width) / 2));\n    }\n`;\n\nconst StyledSpinner = styled(Spinner)`\n    width: 50px;\n    height: 50px;\n    margin: 100px auto;\n`;\n\nconst MarketingSpinner = observer(() => (\n    <div data-test-id={TEST_ID_LOYALTY_MARKETING}>\n        <StyledSpinner isLoading />\n    </div>\n));\n\n// eslint-disable-next-line @estee/elc-best-practice/uses-observer\n@observer\nclass LoyaltyMarketingPage extends React.Component<ILoyaltyMarketingPage> {\n    public static displayName: string;\n\n    public componentDidMount = async () => {\n        await this.props.viewController.loaded();\n    };\n\n    public render() {\n        const { viewController } = this.props;\n        const { isLoading, isLoyaltyUser, layouts, configs, isSignedIn } = viewController.data;\n        const userSignedInClass = isSignedIn\n            ? classes('user-state-logged-in')\n            : classes('user-state-not-logged-in');\n        const loyaltyClass = isLoyaltyUser\n            ? loyaltyMarketingPageClass\n            : loyaltyMarketingPageClassNonLoyalty;\n        const loyaltyMarketingPageUserStateClass =  userSignedInClass\n            ? `${userSignedInClass} ${loyaltyClass}`\n            : loyaltyClass;\n        const featureConfig: IMarketingPageFeature = {\n            componentConfig: configs,\n            controller: viewController\n        };\n\n        if (isLoading) {\n            return <MarketingSpinner />;\n        }\n\n        return (\n            <WithStyles>\n                <LoyaltyMarketingPageWrapper\n                    smallLayout={layouts.smallLayout}\n                    largeLayout={layouts.largeLayout}\n                    className={loyaltyMarketingPageUserStateClass}\n                    data-test-id={TEST_ID_LOYALTY_MARKETING}\n                >\n                    <OrderRender\n                        orderConfig={configs}\n                        serviceName={serviceName}\n                        viewRegistry={getMarketingPageViewRegistry(featureConfig)}\n                    />\n                </LoyaltyMarketingPageWrapper>\n            </WithStyles>\n        );\n    }\n}\n\nLoyaltyMarketingPage.displayName = 'LoyaltyMarketingPage';\n\nexport default LoyaltyMarketingPage;\n","import React, { ReactNode } from 'react';\nimport { ISiteConfig } from '~domain/entities/ISiteConfig';\n\nfunction WithStyles(props: { children: ReactNode }) {\n    const loyaltyConfig = (window?.site as ISiteConfig)?.loyaltyConfig?.loyalty;\n\n    import(`../../styles/${loyaltyConfig?.brandName.toLowerCase()}.css`);\n\n    return <>{props.children}</>;\n}\n\nexport default WithStyles;","import { IPosition } from '~views/components/interfaces';\n\nconst classNames = require('classnames');\n\nexport const classes = (component: string, ...otherClassNames: (string | undefined)[]) =>\n    classNames(`elc-${component}`, `js-${component}`, otherClassNames);\n\nexport const addFullBleed = (position: IPosition['position']) =>\n    position?.extend ? 'fullbleed' : '';\n","import * as React from 'react';\nimport { observer } from 'mobx-react';\nimport styled from 'styled-components';\nimport { classes } from '~utils/Classes';\n\nexport interface ILoyaltyTierDiamond {\n    loyaltyTier?: number;\n    sign?: string;\n    size?: string;\n    textColor: string;\n}\n\nconst BenefitsRewardsTableWrapperDot = styled.div<{ textColor: string }>`\n    color: ${({ textColor }) => `#${textColor}`};\n    grid-area: benefitsRewardsTableWrraperDot;\n`;\n\nconst BenefitsRewardsTableWrapperDotTransform = styled.div`\n    transform: rotate(-45deg);\n`;\n\nconst BenefitsRewardsTableWrapperDotBronze = styled.div<{ size?: string }>`\n    grid-area: benefitsRewardsTableWrraperDot;\n    background-color: #bc8888;\n    border-top: ${({ size }) => (size ? size : '6px')} solid #ac7171;\n    border-right: ${({ size }) => (size ? size : '6px')} solid #935555;\n    border-bottom: ${({ size }) => (size ? size : '6px')} solid #a36868;\n    border-left: ${({ size }) => (size ? size : '6px')} solid #c18b8b;\n`;\nconst BenefitsRewardsTableWrapperDotSilver = styled.div<{ size?: string }>`\n    grid-area: benefitsRewardsTableWrraperDot;\n    background-color: #a1a1a1;\n    border-top: ${({ size }) => (size ? size : '6px')} solid #a1a1a1;\n    border-right: ${({ size }) => (size ? size : '6px')} solid #959595;\n    border-bottom: ${({ size }) => (size ? size : '6px')} solid #b4b4b4;\n    border-left: ${({ size }) => (size ? size : '6px')} solid #bdbdbd;\n`;\nconst BenefitsRewardsTableWrapperDotGold = styled.div<{ size?: string }>`\n    grid-area: benefitsRewardsTableWrraperDot;\n    background-color: #96783d;\n    border-top: ${({ size }) => (size ? size : '6px')} solid #96783d;\n    border-right: ${({ size }) => (size ? size : '6px')} solid #8e6e33;\n    border-bottom: ${({ size }) => (size ? size : '6px')} solid #ab853e;\n    border-left: ${({ size }) => (size ? size : '6px')} solid #c29b4e;\n`;\n\nconst BenefitsRewardsTableWrapperDotPlatinum = styled.div<{ size?: string }>`\n    grid-area: benefitsRewardsTableWrraperDot;\n    background-color: #8fb5cd;\n    border-top: ${({ size }) => (size ? size : '6px')} solid #8fb5cd;\n    border-right: ${({ size }) => (size ? size : '6px')} solid #7b9bae;\n    border-bottom: ${({ size }) => (size ? size : '6px')} solid #7092a8;\n    border-left: ${({ size }) => (size ? size : '6px')} solid #83abc6;\n`;\n\nconst benefitsRewardsTableWrapperDotClass = classes(\n    'loyalty-marketing-page-benefits-rewards__table__dot',\n    'elc-loyalty-marketing-page-benefits-rewards__table__diamond'\n);\nconst tierInfoWrapperClass = classes('loyalty-tier-diamond-wrapper');\nexport const TEST_ID_LOYALTY_TIER_DIAMOND = 'loyalty-tier-diamond';\n\nexport const LoyaltyTierDiamond = observer(function LoyaltyTierDiamond({\n    loyaltyTier,\n    textColor,\n    size\n}: ILoyaltyTierDiamond) {\n    const getDiamond = (tier: number) => {\n        switch (tier) {\n            case 1:\n                return (\n                    <BenefitsRewardsTableWrapperDotBronze\n                        className={benefitsRewardsTableWrapperDotClass}\n                        size={size}\n                    ></BenefitsRewardsTableWrapperDotBronze>\n                );\n            case 2:\n                return (\n                    <BenefitsRewardsTableWrapperDotSilver\n                        className={benefitsRewardsTableWrapperDotClass}\n                        size={size}\n                    ></BenefitsRewardsTableWrapperDotSilver>\n                );\n            case 3:\n                return (\n                    <BenefitsRewardsTableWrapperDotGold\n                        className={benefitsRewardsTableWrapperDotClass}\n                        size={size}\n                    ></BenefitsRewardsTableWrapperDotGold>\n                );\n            case 4:\n                return (\n                    <BenefitsRewardsTableWrapperDotPlatinum\n                        className={benefitsRewardsTableWrapperDotClass}\n                        size={size}\n                    ></BenefitsRewardsTableWrapperDotPlatinum>\n                );\n            default:\n                return (\n                    <BenefitsRewardsTableWrapperDot\n                        className={benefitsRewardsTableWrapperDotClass}\n                        textColor={textColor}\n                    ></BenefitsRewardsTableWrapperDot>\n                );\n        }\n    };\n\n    const lt = loyaltyTier ? loyaltyTier : 0;\n\n    return (\n        <div className={tierInfoWrapperClass} data-test-id={TEST_ID_LOYALTY_TIER_DIAMOND}>\n            <BenefitsRewardsTableWrapperDotTransform>\n                {getDiamond(lt)}\n            </BenefitsRewardsTableWrapperDotTransform>\n        </div>\n    );\n});\n","import styled from 'styled-components';\nimport { Breakpoints } from '@estee/elc-base-theme';\nimport { SliderView } from '@estee/elc-slider';\n\nexport const StyledSlider = styled(SliderView)`\n    padding: 0 15px;\n    @media only screen and (min-width: ${Breakpoints.desktop}px) {\n        padding: 0;\n    }\n`;\n","import * as React from 'react';\nimport { observer } from 'mobx-react';\nimport styled from 'styled-components';\n\nimport { ServiceView } from '@estee/elc-service';\nimport { LOYALTY_EARN_POINTS } from '@estee/elc-service-view-names';\nimport { IPosition } from '~views/components/interfaces';\nimport { ILoyaltyEarnPoints } from './ILoyaltyEarnPoints';\nimport { serviceName } from '~setup/packageInfo';\nimport { addFullBleed, classes } from '~utils/Classes';\nimport { dashboardSections as ds } from '~views/dashboard/sections';\n\nconst LoyaltyEarnPointsWrapper = styled.div`\n    grid-area: ${ds.earnPoints};\n    min-width: 0;\n`;\n\nconst LoyaltyEarnPointsInnerWrapper = styled.div``;\n\nexport interface ILoyaltyEarnPointsData {\n    text: string;\n}\n\nexport interface ILoyaltyEarnPointsContent {\n    earnPointsHeader: ILoyaltyEarnPointsData;\n    earnPointsSubHeader: ILoyaltyEarnPointsData;\n    earnPointInfo: ILoyaltyEarnPoints[];\n}\n\nexport interface ILoyaltyEarnPointsView extends IPosition {\n    earnPoints: ILoyaltyEarnPointsContent;\n}\n\nexport const TEST_ID_EARNPOINTS = 'loyalty-dashboard-earn-points';\nconst earnPointsClass = classes('loyalty-dashboard-earn-points-info');\nconst loyaltyEarnPointsInnerWrapper = classes('loyalty-dashboard-earn-points-info-inner-wrapper');\n\nexport const LoyaltyEarnPoints = observer(function LoyaltyEarnPoints(\n    section: ILoyaltyEarnPointsView\n) {\n    const { position } = section;\n    const classNames = `${earnPointsClass} ${addFullBleed(position)}`;\n\n    return (\n        <LoyaltyEarnPointsWrapper className={classNames} data-test-id={TEST_ID_EARNPOINTS}>\n            <LoyaltyEarnPointsInnerWrapper className={loyaltyEarnPointsInnerWrapper}>\n                <ServiceView\n                    name={LOYALTY_EARN_POINTS}\n                    serviceName={serviceName}\n                    config={section}\n                />\n            </LoyaltyEarnPointsInnerWrapper>\n        </LoyaltyEarnPointsWrapper>\n    );\n});\n","export const dashboardSections = {\n    loyaltyConfig: 'loyaltyConfig',\n    loyaltySubmitAReceipt: 'loyaltySubmitAReceipt',\n    pointsHistory: 'pointsHistory',\n    earnPoints: 'earnPoints',\n    benefits: 'benefits',\n    rewards: 'rewards',\n    faq: 'faq',\n    birthday: 'birthday',\n    ctaSection: 'ctaSection'\n};\n","const { name } = __serviceInfo__;\nexport { name as serviceName };\n","var map = {\n\t\"./clinique.css\": [\n\t\t\"./src/styles/clinique.css\",\n\t\t\"src_styles_clinique_css\"\n\t],\n\t\"./mac.css\": [\n\t\t\"./src/styles/mac.css\",\n\t\t\"src_styles_mac_css\"\n\t],\n\t\"./tailwind.css\": [\n\t\t\"./src/styles/tailwind.css\"\n\t]\n};\nfunction webpackAsyncContext(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\treturn Promise.resolve().then(() => {\n\t\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\t\te.code = 'MODULE_NOT_FOUND';\n\t\t\tthrow e;\n\t\t});\n\t}\n\n\tvar ids = map[req], id = ids[0];\n\treturn Promise.all(ids.slice(1).map(__webpack_require__.e)).then(() => {\n\t\treturn __webpack_require__.t(id, 7 | 16);\n\t});\n}\nwebpackAsyncContext.keys = () => (Object.keys(map));\nwebpackAsyncContext.id = \"./src/styles lazy recursive ^\\\\.\\\\/.*\\\\.css$\";\nmodule.exports = webpackAsyncContext;"],"names":["Tab","render","this","props","children","ContentSpacing","Breakpoints","desktop","largeScreen","extraLargeScreen","breakpoint","brp","code","placeholders","result","reduce","acc","holder","idx","length","Emphasis","value","className","Colors","tabHeaderTheme","StyledTabHeader","displayName","TabHeader","tabHeaderRef","onClick","onSelect","tabId","onKeyDown","event","key","onSelectNext","onSelectPrevious","componentDidUpdate","prevProps","current","isCurrent","focus","tabIndex","keepButtonTabOrder","icon","tabHeaderId","tabPanelId","title","subtitle","classNames","classnames","id","ref","role","TabPanel","renderAllContent","panelNotTabbable","hidden","StyledTabList","classNamesTabsList","classNamesTabPanelsWrapper","Tabs","constructor","super","currentTabId","tabIds","getTabIds","totalTabs","index","findIndex","getTabs","tab","filter","uniqueNumber","Date","getTime","classNamesTabWrapper","tabs","tabHeaders","tabPanels","marketingPageSections","benefitsRewardsTableTableHeading2Class","benefitsRewardsTableTableHeading3Class","benefitsRewardsTableTableHeading4Class","BenefitsRewardsTableThWrapper","BenefitsRewardsTableHeading3","textColor","BenefitsRewardsTableHeading4","BenefitsRewardsTableTh","BenefitsRewardsTableHeading2","BenefitsRewardsTableHeader","observer","tier","levelName","shortDescription","heading","tierColor","backgroundColor","hex","LoyaltyTierDiamond","loyaltyTier","size","sign","benefitsRewardsTableLogoWrapperClass","benefitsRewardsTableColumnHeadersClass","BenefitsRewardsTableThead","data","tableLogo","src","alt","map","item","benefits","levelColor","benefitsRewardsListItemWrapperClass","benefitsRewardsLiClass","benefitsRewardsLiContent","BenefitsRewardsListItemWrapper","BenefitsRewardsItem","subHeading","defaultTheme","breakpoints","fontSizes","space","Box","theme","width","widths","n","i","createMediaQuery","join","align","flexWrap","StyledBox","Object","keys","sort","a","b","Column","xs","sm","md","lg","_xs","_sm","_md","mapBreakpointsToArray","ThemeProvider","LabelDetailDiv","iconCss","css","AccordionIconsStyled","AccordionIcons","HeaderWrapper","LabelDetailSlide","bind","handleHeaderKeyboardAccess","onChange","dislayContent","isOpen","labelSlideClass","onKeyPress","dataTestId","headerBackgroundColor","iconType","extrainfo","benefitsRewardsAccordionClass","benefitsRewardsLabelSlideClass","benefitsRewardsUlClass","PointAccordion","Accordion","PointLabelDetailSlide","BenefitsRewardsPointAccordionWrapper","mapOfItems","labels","label","benefitsRewardsClass","benefitsRewardsHeaderClass","benefitsRewardsHeadingClass","benefitsRewardsSubheadingClass","benefitsRewardsFooterClass","benefitsRewardsSubFooterClass","benefitsRewardsLogoClass","benefitsRewardsLogoPcClass","benefitsRewardsAccordionWrapperClass","benefitsRewardsTableWrapperClass","benefitsRewardsTableTableHeading3NoSubheadingClass","benefitsRewardsTableTableNoSubtitle","benefitsRewardsTableClass","benefitsRewardsTableImageClass","benefitsRewardsTableBenefitItem","benefitsRewardsTableRowHeadersClass","benefitsRewardsTableDataCellClass","faqSectionWrapperClass","faqSectionClass","BenefitsRewardsSectionWrapper","BenefitsRewardsTable","BenefitsRewardsHeaderWrapper","BenefitsRewardsSubheaderWrapper","BenefitsRewardsLogoWrapper","BenefitsRewardsLogoWrapperPC","BenefitsRewardsFooterWrapper","BenefitsRewardsSubFooterWrapper","BenefitsRewardsAccordionWrapper","BenefitsRewardsTableWrapper","FaqSectionWrapper","FaqSection","BenefitsRewards","benefitsRewards","viewController","groupBenefitsByTier","tierLabel","listBenefits","loyaltyBenefitsRewardsImagePc","loyaltyBenefitsRewardsLogo","dangerouslySetInnerHTML","__html","sectionBackground","loyaltyBenefitsRewardsTableLogo","levelOne","levelTwo","levelThree","levelFourth","footer","subfooter","href","TEST_ID_DYNAMIC_REDIRECTION_SECTION","DynamicRedirectionBannerClass","DynamicRedirectionClass","DynamicRedirectionClassBannerParent","DynamicRedirectionFormClass","DynamicRedirectionHeaderClass","DynamicRedirectionImageClass","DynamicRedirectionImageLoyaltyClass","DynamicRedirectionJoinWrapperClass","DynamicRedirectionJoinButtonClass","DynamicRedirectionMemberClass","DynamicRedirectionProgramNameClass","DynamicRedirectionSubheaderClass","DynamicRedirectionDescriptionClass","DynamicRedirectionWrapperClass","DynamicRedirectionHeaderWrapperClass","DynamicRedirectionWrapper","componentType","sectionBackgroundColor","sectionTextColor","bannerExists","DynamicRedirectionBannerParent","DynamicRedirectionBannerImage","DynamicRedirectionEmailField","DynamicRedirectionForm","DynamicRedirectionHeader","DynamicRedirectionJoinWrapper","DynamicRedirectionJoinButton","DynamicRedirectionMember","DynamicRedirectionProgramName","DynamicRedirectionSectionWrapper","DynamicRedirectionSubheader","DynamicRedirectionDescription","DynamicRedirectionHeaderWrapper","DynamicRedirection","dynamicRedirection","description","emailPlaceholder","guestButton","loyaltyBannerImage","loyaltyButton","loyaltyHeader","loyaltyMemberSignIn","loyaltyProgramName","nonLoyaltyHeader","onlineButton","sectionButtonColors","subheader","isLoyaltyUser","isOnlineUser","type","buttonState","headerState","isGuestUser","isNonLoyaltyUser","displaySubheader","displayDescription","method","action","url","placeholder","name","v","style","color","HeroSectionWrapper","imgUrl","HeroSectionLogoWrapper","HeroSectionTextLinesWrapper","heroSectionClass","heroSectionLogoClass","heroSectionImageLogoClass","heroSectionTextLinesClass","HeroSection","heroSection","imageUrl","loyaltyHeroSectionBackground","logoPosition","loyaltyHeroLogoPosition","loyaltyHeroLogo","textLines","textLine","howItWorksItemWrapperClass","howItWorksStepIdentifierClass","howItWorksStepNameClass","howItWorksStepNumberClass","howItWorksStepDescriptionClass","howItWorksStepDescriptionParagraphClass","HowItWorksItemWrapper","HowItWorksStepImage","HowItWorksStepIdentifier","exitingImage","stepNumber","stepImage","stepName","stepDescription","itemNumber","itemNr","areaDef","maxItemColumns","itemsLeft","maxColumnsInRow","j","Math","trunc","howItWorksWrapperClass","howItWorksClass","howItWorksHeaderClass","howItWorksSubheaderClass","howItWorksStepsClass","HowItWorksWrapper","HowItWorksSectionWrapper","HowItWorksHeaderWrapper","HowItWorksSubheaderWrapper","HowItWorksStepsWrapper","stepsItems","HowItWorks","howItWorks","header","val","TierBenefitSectionWrapper","PointBenefit","section","ServiceView","serviceName","config","tierBenefitsWrapperClass","headingSectionClass","headingWrapperClass","subHeadingWrapperClass","tierBenefitsSliderClass","benefitItemClass","benefitItemImageClass","benefitItemDetailsClass","benefitItemTitleClass","benefitItemDescriptionClass","TierBenefitsWrapper","TierBenefitsWrapperInner","HeadingSection","HeadingWrapper","SubheadingWrapper","ItemWrapper","BenefitImage","BenefitTitle","BenefitDescription","TabsWrapper","inactiveColor","TabContent","tabsWrapperClass","tierBenefitsWrapperInner","BenefitItem","benefitImage","cardTextColor","TierBenefits","tierBenefits","subHeader","tierBenefitsBackgroundColor","inactiveTabsColor","slider","noOfSliderCards","noOfCardsMovement","tiers","disableTabs","sliderCount","text","cardMovementCount","setCurrentTabId","benefitItems","filteredBenefits","benefit","includes","benefitItem","infinitySlider","sliderInfiniteSettings","dots","arrows","slidesToShow","slidesToScroll","accessibility","infinite","responsive","settings","centerMode","lazyload","items","sliderSettings","loadFeatureOnDemand","feature","componentConfig","controller","paramsKey","params","loadOnDemand","getMarketingPageViewRegistry","featureConfig","earnPoints","TEST_ID_LOYALTY_MARKETING","TEST_ID_LOYALTY_MARKETING_SPINNER","loyaltyMarketingPageClass","loyaltyMarketingPageClassNonLoyalty","loyaltyConfigs","LoyaltyMarketingPageWrapper","smallLayout","largeLayout","StyledSpinner","Spinner","MarketingSpinner","isLoading","LoyaltyMarketingPage","componentDidMount","loaded","layouts","configs","isSignedIn","userSignedInClass","loyaltyClass","loyaltyMarketingPageUserStateClass","WithStyles","OrderRender","orderConfig","viewRegistry","loyaltyConfig","window","site","loyalty","brandName","toLowerCase","classes","component","otherClassNames","addFullBleed","position","extend","BenefitsRewardsTableWrapperDot","BenefitsRewardsTableWrapperDotTransform","BenefitsRewardsTableWrapperDotBronze","BenefitsRewardsTableWrapperDotSilver","BenefitsRewardsTableWrapperDotGold","BenefitsRewardsTableWrapperDotPlatinum","benefitsRewardsTableWrapperDotClass","tierInfoWrapperClass","lt","getDiamond","StyledSlider","LoyaltyEarnPointsWrapper","LoyaltyEarnPointsInnerWrapper","earnPointsClass","loyaltyEarnPointsInnerWrapper","LoyaltyEarnPoints","dashboardSections","loyaltySubmitAReceipt","pointsHistory","rewards","faq","birthday","ctaSection","webpackAsyncContext","req","__webpack_require__","o","Promise","resolve","then","e","Error","ids","all","slice","t","module","exports"],"sourceRoot":""}