{"version":3,"file":"143.chunk.js","mappings":"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","sources":["webpack://oriloyaltydialog/./src/constants.ts","webpack://oriloyaltydialog/./src/context/appContext.ts","webpack://oriloyaltydialog/./src/context/AppContextProvider.tsx","webpack://oriloyaltydialog/./src/context/useAppContext.ts","webpack://oriloyaltydialog/./src/components/BuyForPointsButton.tsx","webpack://oriloyaltydialog/./src/components/DialogContent.tsx","webpack://oriloyaltydialog/./src/components/DialogHeader.tsx","webpack://oriloyaltydialog/./src/DialogApp.tsx","webpack://oriloyaltydialog/./src/utils/getConfiguration.ts","webpack://oriloyaltydialog/./src/AppRender.tsx"],"sourcesContent":["import type { TranslationKeys } from './types';\n\nexport const DEFAULT_TRANSLATIONS = {\n  _0P: '{0} P',\n  congratulations: 'Congratulations!',\n  youHaveLoyaltyPointsThatYouCanUseOnThisProduct:\n    'You have loyalty points that you can use on this product.',\n  chooseHowYouWantToPayForIt: 'Choose how you want to pay for it:',\n  loyaltyPrice: ' + {0}',\n};\n\nexport const DEFAULT_CONFIG = {\n  staticApiUrl: '',\n  tenant: '',\n  translations: DEFAULT_TRANSLATIONS,\n};\n\n/**\n * Use this object to access the particular translaion ID / key.\n */\nexport const translationKeys = Object.fromEntries(\n  Object.keys(DEFAULT_TRANSLATIONS).map((cur) => [cur, cur]),\n) as TranslationKeys;\n","import { createContext } from 'react';\n\nimport { DEFAULT_TRANSLATIONS } from '../constants';\nimport type { AppContextValue } from '../types';\n\nexport const appContext = createContext<AppContextValue>({\n  translations: DEFAULT_TRANSLATIONS,\n  // This will be replaced when rendering, because we wont render the app without data\n  data: {\n    catalogueItemId: '0',\n    choiceId: 0,\n    consultantPrice: 0,\n    itemCode: '0',\n    loyaltyPoints: 0,\n    loyaltyPrice: 0,\n    productName: 'none',\n    quantity: 0,\n  },\n});\n","import type * as ShowLoyaltyDialog from '@ori-events/show-loyalty-dialog';\nimport React, { useMemo } from 'react';\nimport type { FC } from 'react';\n\nimport type { Translations } from '../types';\nimport { appContext } from './appContext';\nimport { DEFAULT_TRANSLATIONS } from '~/constants';\n\nexport interface AppContextProviderProps {\n  translations?: Partial<Translations>;\n  data: ShowLoyaltyDialog.Data;\n}\n\nexport const AppContextProvider: FC<AppContextProviderProps> = ({\n  translations,\n  data,\n  children,\n}) => {\n  const value = useMemo(\n    () => ({\n      translations: {\n        ...DEFAULT_TRANSLATIONS,\n        ...translations,\n      },\n      data,\n    }),\n    [translations, data],\n  );\n\n  return <appContext.Provider value={value}>{children}</appContext.Provider>;\n};\n","import { useContext } from 'react';\n\nimport { appContext } from './appContext';\n\nexport const useAppContext = () => useContext(appContext);\n","import type { ButtonProps } from '@ori-ui/mui';\nimport { Button } from '@ori-ui/mui';\nimport { useFormatCurrency } from '@ori/culture-provider';\nimport { forwardRef, useMemo } from 'react';\n\nimport { translationKeys } from '../constants';\nimport { useAppContext } from '../context';\n\nexport const BuyForPointsButton = forwardRef<HTMLButtonElement, ButtonProps>((props, ref) => {\n  const { translations, data } = useAppContext();\n  /**\n   * Formatted currency value\n   */\n  const loyaltyPrice = useFormatCurrency(data.loyaltyPrice ?? 0);\n\n  const formattedLoyaltyPoints = useMemo(\n    () => translations[translationKeys._0P].replaceAll('{0}', String(data.loyaltyPoints ?? 0)),\n    [translations, data.loyaltyPoints],\n  );\n\n  const formattedLoyaltyPrice = useMemo(\n    () => translations[translationKeys.loyaltyPrice].replaceAll('{0}', String(loyaltyPrice)),\n    [translations, loyaltyPrice],\n  );\n\n  return (\n    <Button\n      ref={ref}\n      fullWidth\n      variant=\"contained\"\n      color=\"primary\"\n      {...props}\n    >\n      {formattedLoyaltyPoints}\n      {data.loyaltyPrice !== 0 && formattedLoyaltyPrice}\n    </Button>\n  );\n});\n","import { styled, Typography } from '@ori-ui/mui';\nimport useTestId from '@ori/testid-generator';\nimport React from 'react';\n\nimport { translationKeys } from '../constants';\nimport { useAppContext } from '../context';\n\ninterface DialogContentProps {\n  actions: React.ReactNode;\n}\n\nconst Content = styled('div')(({ theme }) => ({\n  boxSizing: 'border-box',\n  padding: theme.spacing(6, 3),\n  background: theme.palette.background.paper,\n}));\n\nconst Text = styled(Typography)(({ theme }) => ({\n  padding: theme.spacing(6, 0),\n}));\n\nconst Actions = styled('div')({\n  display: 'flex',\n  flexDirection: 'column',\n  textAlign: 'center',\n});\n\nconst DialogContent: React.VFC<DialogContentProps> = ({ actions }) => {\n  const { getTestId } = useTestId();\n  const { translations } = useAppContext();\n\n  return (\n    <Content data-testid={getTestId('content')}>\n      <Typography\n        variant=\"h4\"\n        align=\"center\"\n        color=\"textSecondary\"\n      >\n        {translations[translationKeys.congratulations]}\n      </Typography>\n      <Text\n        variant=\"body1\"\n        align=\"center\"\n      >\n        {translations[translationKeys.youHaveLoyaltyPointsThatYouCanUseOnThisProduct]}\n        <br />\n        {translations[translationKeys.chooseHowYouWantToPayForIt]}\n      </Text>\n      {Boolean(actions) && <Actions data-testid={getTestId('actions')}>{actions}</Actions>}\n    </Content>\n  );\n};\n\nexport default DialogContent;\n","import { styled, Typography } from '@ori-ui/mui';\nimport React from 'react';\n\ninterface DialogHeaderProps {\n  points: number | null;\n}\n\nconst Header = styled('div')(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  height: '120px',\n  backgroundColor: theme.palette.purple[100],\n  fontSize: '30px',\n  marginTop: theme.spacing(1),\n}));\n\nconst Points = styled(Typography)(({ theme }) => ({\n  width: theme.typography.pxToRem(74),\n  height: theme.typography.pxToRem(74),\n  borderRadius: '50%',\n  backgroundColor: theme.palette.offer.dark,\n  color: theme.palette.offer.contrastText,\n  lineHeight: theme.typography.pxToRem(74),\n}));\n\nconst DialogHeader: React.VFC<DialogHeaderProps> = ({ points }) => (\n  <Header>\n    <Points\n      variant=\"h4\"\n      align=\"center\"\n    >\n      {points}\n    </Points>\n  </Header>\n);\n\nexport default DialogHeader;\n","import * as AddToBasket from '@ori-events/add-to-basket';\nimport * as LoyaltyDialogResult from '@ori-events/loyalty-dialog-result';\nimport * as ShowLoyaltyDialog from '@ori-events/show-loyalty-dialog';\nimport { Dialog } from '@ori-ui/components';\nimport { Button, Grid } from '@ori-ui/mui';\nimport { FormatCurrency } from '@ori/culture-provider';\nimport React, { useCallback, useState } from 'react';\n\nimport { BuyForPointsButton } from './components/BuyForPointsButton';\nimport DialogContent from './components/DialogContent';\nimport DialogHeader from './components/DialogHeader';\nimport { AppContextProvider } from './context';\nimport type { DialogAppProps } from './types';\n\nconst DialogApp: React.VFC<DialogAppProps> = ({ translations }) => {\n  const [data, setData] = useState<ShowLoyaltyDialog.Data | undefined>();\n\n  React.useEffect(() => {\n    const showLoyaltyDialogCallback = ((event: ShowLoyaltyDialog.Event) => {\n      setData(event.detail);\n    }) as EventListener;\n\n    window.addEventListener(ShowLoyaltyDialog.Name, showLoyaltyDialogCallback);\n\n    return () => window.removeEventListener(ShowLoyaltyDialog.Name, showLoyaltyDialogCallback);\n  }, []);\n\n  const handleLoyaltyDialogResult = useCallback(\n    (result: LoyaltyDialogResult.Result) => {\n      if (data) {\n        const event = new CustomEvent<LoyaltyDialogResult.Data>(LoyaltyDialogResult.Name, {\n          detail: {\n            ...data,\n            result,\n          },\n        });\n        window.dispatchEvent(event);\n        // unmountDialog\n        setData(undefined);\n      }\n    },\n    [data],\n  );\n\n  const handleClose = useCallback(\n    () => handleLoyaltyDialogResult(LoyaltyDialogResult.LoyaltyDialogResults.CLOSE),\n    [handleLoyaltyDialogResult],\n  );\n\n  const handleBuyForPoints = useCallback(\n    () => handleLoyaltyDialogResult(AddToBasket.Method.BUY_FOR_POINTS),\n    [handleLoyaltyDialogResult],\n  );\n\n  const handleBuyForMoney = useCallback(\n    () => handleLoyaltyDialogResult(AddToBasket.Method.BUY_FOR_MONEY),\n    [handleLoyaltyDialogResult],\n  );\n\n  if (!data) {\n    return null;\n  }\n\n  return (\n    <AppContextProvider\n      translations={translations}\n      data={data}\n    >\n      <Dialog\n        open\n        onClose={handleClose}\n      >\n        <DialogHeader points={data.loyaltyPoints} />\n        <DialogContent\n          actions={\n            <Grid\n              container\n              direction=\"column\"\n              spacing={3}\n            >\n              <Grid item>\n                <BuyForPointsButton onClick={handleBuyForPoints} />\n              </Grid>\n              <Grid item>\n                <Button\n                  fullWidth\n                  variant=\"outlined\"\n                  color=\"primary\"\n                  onClick={handleBuyForMoney}\n                >\n                  <FormatCurrency>{data.consultantPrice ?? 0}</FormatCurrency>\n                </Button>\n              </Grid>\n            </Grid>\n          }\n        />\n      </Dialog>\n    </AppContextProvider>\n  );\n};\n\nexport default DialogApp;\n","import { DEFAULT_CONFIG, DEFAULT_TRANSLATIONS } from '../constants';\nimport type { Translations, AppConfiguration } from '../types';\n\nexport const getConfiguration = (element: HTMLElement): AppConfiguration => {\n  if ('config' in element.dataset) {\n    const { config } = element.dataset;\n    const parsedConfiguration = (config ? JSON.parse(config) : {}) as Partial<AppConfiguration>; // Some things may not be set\n\n    return {\n      ...DEFAULT_CONFIG,\n      ...parsedConfiguration,\n    };\n  }\n\n  const translations = {\n    ...DEFAULT_TRANSLATIONS,\n    ...(JSON.parse(element.dataset.translations ?? '{}') as Partial<Translations>),\n  };\n\n  const { staticApiUrl = DEFAULT_CONFIG.staticApiUrl, tenant = DEFAULT_CONFIG.tenant } =\n    element.dataset;\n\n  return { staticApiUrl, tenant, translations };\n};\n","import { ThemeProvider } from '@ori-ui/mui';\nimport { ClientCultureContextProvider } from '@ori/culture-provider';\nimport { TestIdProvider } from '@ori/testid-generator';\nimport ReactDOM from 'react-dom';\n\nimport DialogApp from './DialogApp';\nimport { getConfiguration } from './utils/getConfiguration';\n\nexport const render = (rootElement: HTMLElement): void => {\n  const { staticApiUrl, tenant, translations } = getConfiguration(rootElement);\n\n  ReactDOM.render(\n    <ThemeProvider\n      enableCacheProvider\n      cacheKey=\"ori-basket\"\n    >\n      <ClientCultureContextProvider\n        host={staticApiUrl}\n        tenant={tenant}\n      >\n        <TestIdProvider\n          team=\"Checkout\"\n          project=\"loyalty-dialog\"\n        >\n          <DialogApp translations={translations} />\n        </TestIdProvider>\n      </ClientCultureContextProvider>\n    </ThemeProvider>,\n    rootElement,\n  );\n};\n"],"names":["DEFAULT_TRANSLATIONS","_0P","congratulations","youHaveLoyaltyPointsThatYouCanUseOnThisProduct","chooseHowYouWantToPayForIt","loyaltyPrice","DEFAULT_CONFIG","staticApiUrl","tenant","translations","translationKeys","Object","fromEntries","keys","map","cur","appContext","createContext","data","catalogueItemId","choiceId","consultantPrice","itemCode","loyaltyPoints","productName","quantity","AppContextProvider","children","value","useMemo","Provider","useAppContext","useContext","BuyForPointsButton","forwardRef","props","ref","useFormatCurrency","formattedLoyaltyPoints","replaceAll","String","formattedLoyaltyPrice","Button","fullWidth","variant","color","Content","styled","theme","boxSizing","padding","spacing","background","palette","paper","Text","Typography","Actions","display","flexDirection","textAlign","actions","getTestId","useTestId","align","Boolean","Header","alignItems","justifyContent","height","backgroundColor","purple","fontSize","marginTop","Points","width","typography","pxToRem","borderRadius","offer","dark","contrastText","lineHeight","points","useState","setData","React","showLoyaltyDialogCallback","event","detail","window","addEventListener","ShowLoyaltyDialog","removeEventListener","handleLoyaltyDialogResult","useCallback","result","CustomEvent","LoyaltyDialogResult","dispatchEvent","undefined","handleClose","handleBuyForPoints","AddToBasket","handleBuyForMoney","Dialog","open","onClose","Grid","container","direction","item","onClick","FormatCurrency","render","rootElement","element","dataset","config","parsedConfiguration","JSON","parse","getConfiguration","ReactDOM","ThemeProvider","enableCacheProvider","cacheKey","ClientCultureContext","host","TestIdProvider","team","project"],"sourceRoot":""}