{"version":3,"file":"Platform-quwJuWj5.js","sources":["../../payment-page/src/components/SubTitle/SubTitle.tsx","../../payment-page/src/utilities/MediaQuery.ts","../../payment-page/src/components/Confirmation/ConfirmationModal.tsx","../../payment-page/src/components/Modal/ErrorModal.tsx","../../payment-page/src/utilities/Platform.ts"],"sourcesContent":["import \"./SubTitle.css\";\r\nimport React, { ReactNode } from \"react\";\r\nimport { cx } from \"#utilities/cx\";\r\ntype Props = {\r\n children: ReactNode;\r\n color?: string;\r\n className?: string;\r\n};\r\n\r\nconst SubTitle = ({ children, color = \"\", className = \"\", ...props }: Props) => {\r\n return (\r\n <p className={cx(\"subtitle2\", color, className)} {...props}>\r\n {children}\r\n </p>\r\n );\r\n};\r\n\r\nexport default SubTitle;\r\n","import { useEffect, useState } from \"react\";\r\n\r\n/**\r\n * A hook that creates a MediaQueryList and re-renders whenever the query result changes.\r\n * @param query The media query\r\n * @returns Whether or not the media query is matched.\r\n */\r\nexport const useMediaQuery = (query: string) => {\r\n const [matches, setMatches] = useState(false);\r\n\r\n useEffect(() => {\r\n const media = window.matchMedia(query);\r\n\r\n if (media.matches !== matches) {\r\n setMatches(media.matches);\r\n }\r\n\r\n const listener = () => setMatches(media.matches);\r\n media.addEventListener(\"change\", listener);\r\n return () => window.removeEventListener(\"change\", listener);\r\n }, [matches, query]);\r\n\r\n return matches;\r\n};\r\n\r\n/**\r\n * A hook that returns whether or not the page is currently within the small breakpoint (small.css)\r\n */\r\nexport const useIsSmall = () => {\r\n return useMediaQuery(\"(min-width: 0) and (max-width: 57.5rem)\");\r\n};\r\n\r\nexport const useNoInvoiceColumns = () => {\r\n return useMediaQuery(\"(min-width: 0) and (max-width: 69rem)\");\r\n};\r\n\r\n// returns true if the main tabs are visible\r\nexport const useHasTabs = () => useMediaQuery(\"(min-width: 0) and (max-width: 57.5rem)\");\r\n","import \"./confirmationModal.css\";\r\nimport { Button } from \"#components/Button/Button\";\r\nimport { ButtonVariants } from \"#components/Button/buttonTypes\";\r\nimport { BasicModalProps, Modal } from \"#components/Modal/Modal\";\r\n\r\ninterface Props extends BasicModalProps {\r\n handleConfirm?: () => void;\r\n allowEscape?: boolean;\r\n}\r\n\r\nexport const ConfirmationModal = ({\r\n title = \"\",\r\n children,\r\n isOpen = false,\r\n handleClose,\r\n handleConfirm,\r\n allowEscape = true,\r\n className,\r\n}: Props) => {\r\n return (\r\n <Modal\r\n isOpen={isOpen}\r\n title={title}\r\n handleClose={allowEscape ? handleClose : undefined}\r\n className={`confirmation ${className ? className : \"modal-small\"}`}\r\n >\r\n <div className=\"confirmation-modal\">\r\n <div className=\"confirmation-content flow\">{children}</div>\r\n <div className=\"confirmation-action\">\r\n <Button variant={ButtonVariants.outline} onClick={handleClose}>\r\n Cancel\r\n </Button>\r\n <Button onClick={handleConfirm}>Confirm</Button>\r\n </div>\r\n </div>\r\n </Modal>\r\n );\r\n};\r\n","import \"./Modal.css\";\r\nimport { Modal } from \"./Modal\";\r\nimport Icon from \"#components/Icons/Icon\";\r\n\r\ninterface ErrorModalProps {\r\n isOpen: boolean;\r\n title: string;\r\n children: JSX.Element;\r\n className?: string;\r\n handleClose?: () => void;\r\n}\r\n\r\nexport const ErrorModal = ({\r\n isOpen,\r\n title,\r\n children,\r\n className,\r\n handleClose,\r\n}: ErrorModalProps) => {\r\n return (\r\n <Modal\r\n isOpen={isOpen}\r\n className={`react-modal-content ${className ? className : \"\"}`}\r\n title={title}\r\n handleClose={handleClose}\r\n optionalHeader={\r\n <div className=\"text-center\">\r\n <Icon>error</Icon>\r\n </div>\r\n }\r\n children={children}\r\n ></Modal>\r\n );\r\n};\r\n","export const isAppleMobile = () =>\r\n [\"iPad Simulator\", \"iPhone Simulator\", \"iPod Simulator\", \"iPad\", \"iPhone\", \"iPod\"].includes(\r\n navigator.platform\r\n ) ||\r\n // iPad on iOS 13 detection\r\n (navigator.userAgent.includes(\"Mac\") && \"ontouchend\" in document);\r\n"],"names":["SubTitle","children","color","className","props","jsx","cx","useMediaQuery","query","matches","setMatches","useState","useEffect","media","listener","useNoInvoiceColumns","useHasTabs","ConfirmationModal","title","isOpen","handleClose","handleConfirm","allowEscape","Modal","jsxs","Button","ButtonVariants","ErrorModal","Icon","isAppleMobile"],"mappings":"+EASM,MAAAA,EAAW,CAAC,CAAE,SAAAC,EAAU,MAAAC,EAAQ,GAAI,UAAAC,EAAY,GAAI,GAAGC,KAEzDC,MAAC,IAAE,CAAA,UAAWC,EAAG,YAAaJ,EAAOC,CAAS,EAAI,GAAGC,EAClD,SAAAH,CACH,CAAA,ECNSM,EAAiBC,GAAkB,CAC9C,KAAM,CAACC,EAASC,CAAU,EAAIC,WAAS,EAAK,EAE5CC,OAAAA,EAAAA,UAAU,IAAM,CACR,MAAAC,EAAQ,OAAO,WAAWL,CAAK,EAEjCK,EAAM,UAAYJ,GACpBC,EAAWG,EAAM,OAAO,EAG1B,MAAMC,EAAW,IAAMJ,EAAWG,EAAM,OAAO,EACzC,OAAAA,EAAA,iBAAiB,SAAUC,CAAQ,EAClC,IAAM,OAAO,oBAAoB,SAAUA,CAAQ,CAAA,EACzD,CAACL,EAASD,CAAK,CAAC,EAEZC,CACT,EASaM,EAAsB,IAC1BR,EAAc,uCAAuC,EAIjDS,EAAa,IAAMT,EAAc,yCAAyC,EC3B1EU,EAAoB,CAAC,CAChC,MAAAC,EAAQ,GACR,SAAAjB,EACA,OAAAkB,EAAS,GACT,YAAAC,EACA,cAAAC,EACA,YAAAC,EAAc,GACd,UAAAnB,CACF,IAEIE,EAAA,IAACkB,EAAA,CACC,OAAAJ,EACA,MAAAD,EACA,YAAaI,EAAcF,EAAc,OACzC,UAAW,gBAAgBjB,GAAwB,aAAa,GAEhE,SAAAqB,EAAA,KAAC,MAAI,CAAA,UAAU,qBACb,SAAA,CAACnB,EAAAA,IAAA,MAAA,CAAI,UAAU,4BAA6B,SAAAJ,CAAS,CAAA,EACrDuB,EAAAA,KAAC,MAAI,CAAA,UAAU,sBACb,SAAA,CAAAnB,MAACoB,GAAO,QAASC,EAAe,QAAS,QAASN,EAAa,SAE/D,SAAA,EACCf,EAAA,IAAAoB,EAAA,CAAO,QAASJ,EAAe,SAAO,UAAA,CAAA,EACzC,CAAA,EACF,CAAA,CAAA,ECtBOM,EAAa,CAAC,CACzB,OAAAR,EACA,MAAAD,EACA,SAAAjB,EACA,UAAAE,EACA,YAAAiB,CACF,IAEIf,EAAA,IAACkB,EAAA,CACC,OAAAJ,EACA,UAAW,uBAAuBhB,GAAwB,EAAE,GAC5D,MAAAe,EACA,YAAAE,EACA,qBACG,MAAI,CAAA,UAAU,cACb,SAACf,EAAA,IAAAuB,EAAA,CAAK,iBAAK,CACb,CAAA,EAEF,SAAA3B,CAAA,CAAA,EC9BO4B,EAAgB,IAC3B,CAAC,iBAAkB,mBAAoB,iBAAkB,OAAQ,SAAU,MAAM,EAAE,SACjF,UAAU,QACZ,GAEC,UAAU,UAAU,SAAS,KAAK,GAAK,eAAgB"}