{"version":3,"file":"google-pay.es.mjs","sources":["../../../src/components/google-pay/google-pay.tsx"],"sourcesContent":["// Dependencies\nimport * as React from 'react';\nimport type * as Square from '@square/web-sdk';\n\n// Internals\nimport { useForm } from '~/contexts/form';\nimport { useEventListener } from '~/hooks/use-event-listener';\nimport { ButtonLoader } from './google-pay.styles';\nimport type { GooglePayProps } from './google-pay.types';\n\n/**\n * Renders a Google Pay button to use in the Square Web Payment SDK, pre-styled\n * to meet Google's branding guidelines.\n *\n * **Remember** that you need to set `createPaymentRequest()` in `SquareForm` if\n * you going to use this Payment Method\n *\n * @example\n *\n * ```tsx\n * function App() {\n *   return (\n *     <SquareForm {...props}>\n *       <GooglePay />\n *     </SquareForm>\n *   );\n * }\n * ```\n */\nconst GooglePay = ({\n  buttonColor,\n  buttonSizeMode = 'fill',\n  buttonType = 'long',\n  id = 'rswps-google-pay-container',\n  ...props\n}: GooglePayProps): JSX.Element | null => {\n  const [googlePay, setGooglePay] = React.useState<Square.GooglePay | undefined>(() => undefined);\n  const { cardTokenizeResponseReceived, createPaymentRequest, payments } = useForm();\n  const containerRef = React.useRef<HTMLDivElement>(null);\n\n  const options: Square.GooglePayButtonOptions = React.useMemo(() => {\n    const baseOptions = {\n      buttonColor,\n      buttonSizeMode,\n      buttonType,\n    };\n\n    // if a value from options is undefined delete it from the options object\n    return Object.keys(baseOptions).reduce((acc: Record<string, unknown>, key) => {\n      if (baseOptions[key as keyof typeof baseOptions] !== undefined) {\n        acc[key as string] = baseOptions[key as keyof typeof baseOptions];\n      }\n\n      return acc;\n    }, {});\n  }, [buttonColor, buttonSizeMode, buttonType]);\n\n  /**\n   * Handle the on click of the Google Pay button click\n   *\n   * @param e An event which takes place in the DOM.\n   * @returns The data be sended to `cardTokenizeResponseReceived()` function, or an error\n   */\n  const handlePayment = async (e: Event) => {\n    e.stopPropagation();\n\n    if (!googlePay) {\n      console.warn('Google Pay button was clicked, but no Google Pay instance was found.');\n\n      return;\n    }\n\n    try {\n      const result = await googlePay.tokenize();\n\n      if (result.status === 'OK') {\n        return cardTokenizeResponseReceived(result);\n      }\n\n      let message = `Tokenization failed with status: ${result.status}`;\n      if (result && 'errors' in result) {\n        message += ` and errors: ${JSON.stringify(result?.errors)}`;\n\n        throw new Error(message);\n      }\n\n      console.warn(message);\n    } catch (error) {\n      console.error(error);\n    }\n  };\n\n  React.useEffect(() => {\n    if (!createPaymentRequest) {\n      throw new Error('`createPaymentRequest()` is required when using digital wallets');\n    }\n\n    const abortController = new AbortController();\n    const { signal } = abortController;\n\n    const start = async (signal: AbortSignal) => {\n      const paymentRequest = payments?.paymentRequest(createPaymentRequest);\n\n      if (!paymentRequest) {\n        throw new Error('`paymentRequest` is required when using digital wallets');\n      }\n\n      try {\n        const googlePay = await payments?.googlePay(paymentRequest).then((res) => {\n          if (signal?.aborted) {\n            return;\n          }\n\n          setGooglePay(res);\n\n          return res;\n        });\n\n        await googlePay?.attach(`#${id}`, options);\n\n        if (signal.aborted) {\n          await googlePay?.destroy();\n        }\n      } catch (error) {\n        console.error('Initializing Google Pay failed', error);\n      }\n    };\n\n    start(signal);\n\n    return () => {\n      abortController.abort();\n    };\n  }, [createPaymentRequest, payments, options]);\n\n  useEventListener({\n    listener: handlePayment,\n    type: 'click',\n    element: containerRef,\n    options: {\n      passive: true,\n    },\n  });\n\n  return (\n    <div {...props} id={id} ref={containerRef}>\n      {!googlePay ? <ButtonLoader /> : null}\n    </div>\n  );\n};\n\nexport default GooglePay;\nexport * from './google-pay.types';\n"],"names":["GooglePay","buttonColor","buttonSizeMode","buttonType","id","props","googlePay","setGooglePay","React","cardTokenizeResponseReceived","createPaymentRequest","payments","useForm","containerRef","options","baseOptions","acc","key","handlePayment","e","result","message","error","abortController","signal","paymentRequest","res","useEventListener","ButtonLoader","GooglePay$1"],"mappings":";;;;AA6BA,MAAMA,IAAY,CAAC;AAAA,EACjB,aAAAC;AAAA,EACA,gBAAAC,IAAiB;AAAA,EACjB,YAAAC,IAAa;AAAA,EACb,IAAAC,IAAK;AAAA,KACFC;AACL,MAA0C;AACxC,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAM,SAAuC,MAAA;AAAA,GAAe,GACxF,EAAE,8BAAAC,GAA8B,sBAAAC,GAAsB,UAAAC,MAAaC,EAAQ,GAC3EC,IAAeL,EAAM,OAAuB,IAAI,GAEhDM,IAAyCN,EAAM,QAAQ,MAAM;AACjE,UAAMO,IAAc;AAAA,MAClB,aAAAd;AAAA,MACA,gBAAAC;AAAA,MACA,YAAAC;AAAA,IAAA;AAIF,WAAO,OAAO,KAAKY,CAAW,EAAE,OAAO,CAACC,GAA8BC,OAChEF,EAAYE,OAAqC,WACnDD,EAAIC,KAAiBF,EAAYE,KAG5BD,IACN,CAAE,CAAA;AAAA,EACJ,GAAA,CAACf,GAAaC,GAAgBC,CAAU,CAAC,GAQtCe,IAAgB,OAAOC,MAAa;AAGxC,QAFAA,EAAE,gBAAgB,GAEd,CAACb,GAAW;AACd,cAAQ,KAAK,sEAAsE;AAEnF;AAAA,IACF;AAEI,QAAA;AACI,YAAAc,IAAS,MAAMd,EAAU;AAE3B,UAAAc,EAAO,WAAW;AACpB,eAAOX,EAA6BW,CAAM;AAGxC,UAAAC,IAAU,oCAAoCD,EAAO;AACrD,UAAAA,KAAU,YAAYA;AACxB,cAAAC,KAAW,gBAAgB,KAAK,UAAUD,GAAQ,MAAM,KAElD,IAAI,MAAMC,CAAO;AAGzB,cAAQ,KAAKA,CAAO;AAAA,aACbC;AACP,cAAQ,MAAMA,CAAK;AAAA,IACrB;AAAA,EAAA;AAGF,SAAAd,EAAM,UAAU,MAAM;AACpB,QAAI,CAACE;AACG,YAAA,IAAI,MAAM,iEAAiE;AAG7E,UAAAa,IAAkB,IAAI,mBACtB,EAAE,QAAAC,EAAW,IAAAD;AA8BnB,YA5Bc,OAAOC,MAAwB;AACrC,YAAAC,IAAiBd,GAAU,eAAeD,CAAoB;AAEpE,UAAI,CAACe;AACG,cAAA,IAAI,MAAM,yDAAyD;AAGvE,UAAA;AACInB,cAAAA,IAAY,MAAMK,GAAU,UAAUc,CAAc,EAAE,KAAK,CAACC,MAAQ;AACxE,cAAIF,CAAAA,GAAQ;AAIZ,mBAAAjB,EAAamB,CAAG,GAETA;AAAA,QAAA,CACR;AAED,cAAMpB,GAAW,OAAO,IAAIF,KAAMU,CAAO,GAErCU,EAAO,WACT,MAAMlB,GAAW;eAEZgB;AACC,gBAAA,MAAM,kCAAkCA,CAAK;AAAA,MACvD;AAAA,IAAA,GAGIE,CAAM,GAEL,MAAM;AACX,MAAAD,EAAgB,MAAM;AAAA,IAAA;AAAA,EAEvB,GAAA,CAACb,GAAsBC,GAAUG,CAAO,CAAC,GAE3Ba,EAAA;AAAA,IACf,UAAUT;AAAA,IACV,MAAM;AAAA,IACN,SAASL;AAAA,IACT,SAAS;AAAA,MACP,SAAS;AAAA,IACX;AAAA,EAAA,CACD,GAGE,gBAAAL,EAAA,cAAA,OAAA,EAAK,GAAGH,GAAO,IAAAD,GAAQ,KAAKS,EAC1B,GAACP,IAA+B,OAAnB,gBAAAE,EAAA,cAACoB,GAAa,IAAA,CAC9B;AAEJ,GAEAC,IAAe7B;"}