{"version":3,"file":"4355.bundle.js","mappings":"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","sources":["webpack:///../node_modules/@paypalcorp/pp-react-buttons/dist/@paypalcorp/styles.css.js","webpack:///../node_modules/@paypalcorp/pp-react-buttons/dist/@paypalcorp/pp-react-buttons.esm.js"],"sourcesContent":["import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';\n__vanilla_filescope__.setFileScope(\"src/styles.css.ts\", \"@paypalcorp/pp-react-buttons\");\nimport { style, keyframes, fallbackVar, globalStyle } from '@vanilla-extract/css';\nimport { textStyles } from '@paypalcorp/pp-react-text';\nimport { focusStyles, contextColors } from '@paypalcorp/pp-react-utils';\nimport { tokens, breakpoints } from '@paypalcorp/pp-react-theme';\nconst buttonSmMinWidth = '3.75rem';\nconst buttonLgMinWidth = '6rem';\nconst {\n focusOffsetElementStyles\n} = focusStyles;\nconst fadeIn = keyframes({\n '0%': {\n opacity: 0\n },\n '100%': {\n opacity: 1\n }\n}, 'button_fade_in');\nconst displayFlex = {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center'\n};\nconst getButtonGroupStyles = buttonCount => style({\n display: 'inline-grid',\n gridTemplateColumns: `repeat(${buttonCount}, max-content)`,\n gap: tokens.space[200],\n padding: `${tokens.space[150]} ${tokens.space[200]}`\n}, `button_group-${buttonCount}`);\n// Base Styles for button\nexport const btnBase = style({\n position: 'relative',\n borderRadius: 1000,\n borderStyle: 'solid',\n borderWidth: `${tokens.border.thickness.normal}`,\n cursor: 'pointer',\n textDecoration: 'none',\n ...displayFlex,\n transition: `color ${tokens.motion.duration.action} ease,\n background-color ${tokens.motion.duration.action} ease,\n border-color ${tokens.motion.duration.action} ease`,\n ':focus': focusOffsetElementStyles\n}, 'button_base');\n\n// Always, have color styles written below the button size styles to overwrite the button color\nexport const btnLarge = style({\n ...textStyles.buttonLgStyles,\n minWidth: buttonLgMinWidth,\n padding: `calc(${tokens.space[150]} - ${tokens.border.thickness.emphasis}) calc(${tokens.space[400]} - ${tokens.border.thickness.emphasis})`,\n minHeight: tokens.size.tapTarget.default\n}, 'button_size_lg');\nexport const btnSmall = style({\n ...textStyles.buttonSmStyles,\n minWidth: buttonSmMinWidth,\n minHeight: tokens.size.tapTarget.tiny,\n padding: `calc(${tokens.size.indicator.md} - ${tokens.border.thickness.emphasis}) calc(${tokens.space[200]} - ${tokens.border.thickness.emphasis})`\n}, 'button_size_sm');\nexport const buttonsType = {\n primary: style({\n color: fallbackVar(contextColors.background, tokens.color.primary.contrast),\n border: `${tokens.border.thickness.emphasis} solid ${fallbackVar(contextColors.main, tokens.color.primary.main)}`,\n backgroundColor: fallbackVar(contextColors.main, tokens.color.primary.main),\n ':hover': {\n color: fallbackVar(contextColors.hoverMain, tokens.color.primary.contrast),\n textDecoration: 'none',\n backgroundColor: fallbackVar(contextColors.hoverBack, tokens.color.primary.mainHover),\n borderColor: fallbackVar(contextColors.hoverBack, tokens.color.primary.mainHover)\n },\n ':active': {\n color: fallbackVar(contextColors.activeMain, tokens.color.primary.contrast),\n outline: 'none',\n backgroundColor: fallbackVar(contextColors.activeBack, tokens.color.primary.mainActive),\n borderColor: fallbackVar(contextColors.activeBack, tokens.color.primary.mainActive)\n },\n ':visited': {\n color: fallbackVar(contextColors.main, tokens.color.primary.contrast)\n }\n }, 'button_primary'),\n primaryInverse: style({\n backgroundColor: fallbackVar(contextColors.background, tokens.color.primary.contrast),\n borderColor: fallbackVar(contextColors.background, tokens.color.primary.contrast),\n color: fallbackVar(contextColors.main, tokens.color.primary.main),\n ':hover': {\n color: fallbackVar(contextColors.hoverMain, tokens.color.primary.main),\n backgroundColor: fallbackVar(contextColors.hoverBack, tokens.color.primary.contrastHover),\n borderColor: fallbackVar(contextColors.hoverBack, tokens.color.primary.contrastHover)\n },\n ':active': {\n color: fallbackVar(contextColors.activeMain, tokens.color.primary.main),\n backgroundColor: fallbackVar(contextColors.activeBack, tokens.color.primary.contrastActive),\n borderColor: fallbackVar(contextColors.activeBack, tokens.color.primary.contrastActive)\n },\n ':visited': {\n color: fallbackVar(contextColors.main, tokens.color.primary.main)\n },\n ':focus': {\n border: `${tokens.border.thickness.emphasis} solid ${fallbackVar(contextColors.main, tokens.color.primary.main)}`\n }\n }, 'button_inverse'),\n secondary: style({\n backgroundColor: 'transparent',\n borderColor: fallbackVar(contextColors.main, tokens.color.structure.borderLowContrast),\n color: fallbackVar(contextColors.main, tokens.color.background.highContrast),\n ':visited': {\n color: fallbackVar(contextColors.main, tokens.color.primary.main)\n },\n ':hover': {\n backgroundColor: fallbackVar(contextColors.hoverBack, 'transparent'),\n color: fallbackVar(contextColors.hoverMain, tokens.color.primary.mainHover),\n borderColor: fallbackVar(contextColors.hoverMain, tokens.color.primary.mainHover)\n },\n ':active': {\n backgroundColor: fallbackVar(contextColors.activeBack, 'transparent'),\n color: fallbackVar(contextColors.activeMain, tokens.color.primary.mainActive),\n borderColor: fallbackVar(contextColors.activeMain, tokens.color.primary.mainActive)\n }\n }, 'button_secondary'),\n secondaryInverse: style({\n borderColor: fallbackVar(contextColors.background, tokens.color.primary.contrast),\n color: fallbackVar(contextColors.main, tokens.color.primary.contrast),\n backgroundColor: 'transparent',\n ':visited': {\n color: fallbackVar(contextColors.main, tokens.color.primary.contrastActive)\n },\n ':hover': {\n backgroundColor: 'transparent',\n color: fallbackVar(contextColors.hoverMain, tokens.color.primary.contrastHover),\n borderColor: fallbackVar(contextColors.hoverMain, tokens.color.primary.contrastHover)\n },\n ':active': {\n backgroundColor: fallbackVar(contextColors.activeBack, tokens.color.primary.mainActive),\n color: fallbackVar(contextColors.activeMain, tokens.color.primary.contrastActive),\n borderColor: fallbackVar(contextColors.activeMain, tokens.color.primary.contrastActive)\n },\n ':focus': {\n border: `${tokens.border.thickness.emphasis} solid ${tokens.color.primary.main}`\n }\n }, 'button_secondary_inverse'),\n tertiary: style({\n color: fallbackVar(contextColors.main, tokens.color.link.main),\n padding: 0,\n position: 'relative',\n cursor: 'pointer',\n backgroundColor: 'transparent',\n border: 'none',\n borderRadius: tokens.border.radius.sm,\n minHeight: tokens.size.tapTarget.default,\n ...displayFlex,\n ':hover': {\n color: fallbackVar(contextColors.hoverMain, tokens.color.link.mainHover),\n backgroundColor: fallbackVar(contextColors.hoverBack, 'transparent')\n },\n ':focus': {\n ...focusOffsetElementStyles,\n color: fallbackVar(contextColors.main, tokens.color.link.main)\n },\n ':active': {\n color: fallbackVar(contextColors.activeMain, tokens.color.link.mainActive),\n backgroundColor: fallbackVar(contextColors.activeBack, 'transparent')\n }\n }, 'button_tertiary'),\n overlay: style({\n backgroundColor: fallbackVar(contextColors.background, tokens.color.overlayInverse.main),\n borderColor: fallbackVar(contextColors.main, tokens.color.structure.borderLowContrast),\n color: fallbackVar(contextColors.main, tokens.color.overlayInverse.contrast),\n ':visited': {\n color: fallbackVar(contextColors.main, tokens.color.primary.main)\n },\n ':hover': {\n backgroundColor: fallbackVar(contextColors.hoverBack, tokens.color.background.main)\n },\n ':active': {\n backgroundColor: fallbackVar(contextColors.activeBack, tokens.color.overlayInverse.main),\n color: fallbackVar(contextColors.activeMain, tokens.color.primary.mainActive),\n borderColor: fallbackVar(contextColors.activeMain, tokens.color.primary.mainActive)\n }\n }, 'button_overlay')\n};\nexport const tertiarySmall = style({\n ...textStyles.buttonSmStyles,\n color: fallbackVar(contextColors.main, tokens.color.link.main)\n}, 'button_tertiary-small');\nexport const icon = style({\n marginInlineEnd: tokens.space[100]\n}, 'button_icon');\nexport const affordance = style({\n marginInlineStart: tokens.space[100],\n marginInlineEnd: 0,\n verticalAlign: 'top',\n position: 'relative',\n pointerEvents: 'none'\n}, 'button_affordance');\n\n// Stateful button styles\n// Button success state\nexport const successState = style({\n borderColor: tokens.color.success.main,\n backgroundColor: tokens.color.success.main,\n pointerEvents: 'none'\n}, 'button_success_state');\n\n// Button processing state\nexport const processingState = style({\n color: 'transparent',\n pointerEvents: 'none',\n ':hover': {\n color: 'transparent'\n },\n ':active': {\n color: 'transparent'\n },\n ':visited': {\n color: 'transparent'\n }\n}, 'button_processing_state');\nexport const btnOverlay = style({\n position: 'absolute',\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n borderRadius: 'inherit',\n textAlign: 'center',\n opacity: 0,\n animation: `${fadeIn} ${tokens.motion.duration.hover} ease-in forwards`,\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n paddingRight: 0\n}, 'button_state_overlay');\nexport const successStateOverlay = style({\n backgroundColor: tokens.color.success.main\n}, 'button_success_state_overlay');\nexport const successStateIcon = style({\n color: tokens.color.primary.contrast\n}, 'button_success_state_icon');\nexport const successStateIconSm = style({}, 'button_success_state_icon_sm');\nexport const buttonGroup = {\n 1: getButtonGroupStyles(1),\n 2: getButtonGroupStyles(2),\n 3: getButtonGroupStyles(3)\n};\nexport const btnFullWidth = style({\n '@media': {\n [`(max-width: ${breakpoints.mediaMd})`]: {\n width: '100%'\n }\n }\n}, 'button_full_width');\nexport const btnGroupFullWidth = style({\n '@media': {\n [`(max-width: ${breakpoints.mediaSm})`]: {\n gridTemplateColumns: 'none',\n width: '100%'\n }\n }\n}, 'button_btnGroupFullWidth');\nexport const smallSizeTapContainer = style({\n height: tokens.size.tapTarget.default,\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n background: 'none',\n border: 'none',\n padding: 0,\n ':focus': {\n outline: 'none'\n }\n}, 'button_small_tap_container');\nexport const cursorPointer = style({\n cursor: 'pointer'\n}, 'button-cursor_pointer');\nglobalStyle(`${smallSizeTapContainer}:focus > div:first-of-type:not(${successState}):not(${processingState})`, focusOffsetElementStyles);\n__vanilla_filescope__.endFileScope();\n","import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';\nimport _extends from '@babel/runtime/helpers/esm/extends';\nimport _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';\nimport React, { forwardRef, Children } from 'react';\nimport { LoadingSpinner } from '@paypalcorp/pp-react-loading-spinner';\nimport { screenReaderStyles } from '@paypalcorp/pp-react-screen-reader';\nimport { CheckmarkIcon, ChevronUpIcon, ChevronDownIcon } from '@paypalcorp/pp-react-icons';\nimport { cx, uniqueId, hasWindow } from '@paypalcorp/pp-react-utils';\nimport * as styles from './styles.css';\nexport { styles as buttonStyles };\nimport { breakpoints } from '@paypalcorp/pp-react-theme';\n\nvar _excluded = [\"isMenu\", \"isOpen\", \"isSmall\", \"className\"],\n _excluded2 = [\"variant\", \"size\", \"inverse\", \"secondary\", \"tertiary\", \"isMenu\", \"isOpen\", \"btnState\", \"screenReaderText\", \"className\", \"children\", \"as\", \"iconComponent\", \"fullWidthOnMobile\"];\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nvar buttonVariantStyles = ['primary', 'secondary', 'overlay', 'tertiary'];\nvar AffordanceIcon = function (_ref) {\n var isMenu = _ref.isMenu,\n isOpen = _ref.isOpen,\n isSmall = _ref.isSmall,\n className = _ref.className,\n rest = _objectWithoutProperties(_ref, _excluded);\n if (!isMenu) {\n return null;\n }\n var Icon = isOpen ? ChevronUpIcon : ChevronDownIcon;\n return /*#__PURE__*/React.createElement(Icon, _extends({\n className: className\n }, rest, {\n size: isSmall ? 'xs' : 'sm',\n \"data-ppui\": \"true\"\n }));\n};\nvar Button = forwardRef(function (_ref2, ref) {\n var variant = _ref2.variant,\n size = _ref2.size,\n inverse = _ref2.inverse,\n secondary = _ref2.secondary,\n tertiary = _ref2.tertiary,\n isMenu = _ref2.isMenu,\n isOpen = _ref2.isOpen,\n _ref2$btnState = _ref2.btnState,\n btnState = _ref2$btnState === void 0 ? 'initial' : _ref2$btnState,\n screenReaderText = _ref2.screenReaderText,\n className = _ref2.className,\n children = _ref2.children,\n as = _ref2.as,\n iconComponent = _ref2.iconComponent,\n _ref2$fullWidthOnMobi = _ref2.fullWidthOnMobile,\n fullWidthOnMobile = _ref2$fullWidthOnMobi === void 0 ? true : _ref2$fullWidthOnMobi,\n rest = _objectWithoutProperties(_ref2, _excluded2);\n var isSizeSmall = size === 'sm';\n var isStateInitial = btnState && btnState === 'initial';\n\n /**\n * Get loading spinner component props when the button is in processing state.\n * @returns LoadingSpinnerProps\n */\n var getLoadingSpinnerProps = function () {\n var loadingSpinnerProps = {};\n if (btnState !== 'processing') {\n return loadingSpinnerProps;\n }\n loadingSpinnerProps.as = 'span';\n if (size === 'sm') {\n loadingSpinnerProps.size = 'xs';\n }\n if (variant && (inverse && variant === 'secondary' || !inverse && variant === 'primary')) {\n loadingSpinnerProps.inverse = true;\n } else if (!variant && (secondary && inverse || !secondary && !inverse)) {\n loadingSpinnerProps.inverse = true;\n }\n return loadingSpinnerProps;\n };\n /**\n * Get color styles for deprecated props.\n * @deprecated\n * @param isSecondary\n * @param isInverse\n * @returns ButtonVariantStyle | ButtonInverseVariantStyle\n */\n var getButtonTypeStyles = function (isSecondary, isInverse) {\n var variant = isSecondary ? 'secondary' : 'primary';\n return isInverse ? \"\".concat(variant, \"Inverse\") : variant;\n };\n\n /**\n * Get button variant styles based on the 'variant' prop.\n * @param variant\n * @returns ButtonVariantStyle | ButtonInverseVariantStyle\n */\n var getVariantStyles = function (variant) {\n if (inverse && (variant === 'primary' || variant === 'secondary')) {\n return \"\".concat(variant, \"Inverse\");\n }\n return buttonVariantStyles.includes(variant) ? variant : 'primary';\n };\n var componentProps = _objectSpread({}, rest);\n if (isOpen !== undefined) {\n componentProps['aria-expanded'] = isOpen;\n }\n componentProps['tab-index'] = 0;\n componentProps['disabled'] = !isStateInitial;\n componentProps['ref'] = ref;\n componentProps['data-ppui-info'] = '';\n var Component = as || 'button';\n if (isSizeSmall) {\n Component = 'div';\n }\n var buttonComponent = /*#__PURE__*/React.createElement(Component, _extends({\n className: function getStyleClassNames() {\n var classNames;\n // Not adding the custom className when the `size = 'sm'` as the same is getting added while rendering. See 'ComponentAs' below.\n var customClassName = isSizeSmall ? '' : className;\n if (variant) {\n var colorStyles = getVariantStyles(variant);\n classNames = cx(styles.btnBase, isSizeSmall ? styles.btnSmall : styles.btnLarge, styles.buttonsType[colorStyles], fullWidthOnMobile && styles.btnFullWidth, btnState === 'success' && styles.successState, btnState === 'processing' && styles.processingState, customClassName);\n } else {\n // This is backward compatible code for props primary, secondary and tertiary.\n if (tertiary) {\n classNames = cx(styles.buttonsType['tertiary'], isSizeSmall ? styles.tertiarySmall : styles.btnLarge, customClassName);\n } else {\n var _colorStyles = getButtonTypeStyles(secondary, inverse);\n classNames = cx(styles.btnBase, isSizeSmall ? styles.btnSmall : styles.btnLarge, styles.buttonsType[_colorStyles], fullWidthOnMobile && styles.btnFullWidth, btnState === 'success' && styles.successState, btnState === 'processing' && styles.processingState, customClassName);\n }\n }\n return classNames;\n }(),\n id: uniqueId('button_')\n // Not using any props when the size is small, as this will be used inside a 'Polymorphic' / 'Button' component.\n }, isSizeSmall ? {} : _objectSpread({}, componentProps), {\n \"data-ppui\": \"true\"\n }), function renderChildren() {\n var screenReaderTextElement;\n if (!isStateInitial) {\n screenReaderTextElement = screenReaderText || btnState;\n }\n var successIconClassNames = cx(styles.successStateIcon, isSizeSmall && styles.successStateIconSm);\n var buttonCheckmarkIcon = /*#__PURE__*/React.createElement(CheckmarkIcon, {\n className: successIconClassNames,\n size: isSizeSmall ? 'sm' : 'md',\n \"data-ppui\": \"true\"\n });\n var iconMarkup = null;\n if (iconComponent) {\n iconMarkup = /*#__PURE__*/React.createElement(iconComponent, {\n className: styles.icon,\n size: isSizeSmall ? 'xs' : 'sm',\n \"data-ppui\": \"true\"\n });\n }\n var overlayClassNames = cx(styles.btnOverlay, btnState === 'success' && styles.successStateOverlay);\n var stateOverlay = !isStateInitial ? /*#__PURE__*/React.createElement(\"span\", {\n className: overlayClassNames,\n \"data-ppui\": \"true\"\n }, btnState === 'success' && buttonCheckmarkIcon, btnState === 'processing' && !tertiary && /*#__PURE__*/React.createElement(LoadingSpinner, _extends({}, getLoadingSpinnerProps(), {\n \"data-ppui\": \"true\"\n }))) : null;\n var assistiveText = screenReaderTextElement ? /*#__PURE__*/React.createElement(\"span\", {\n role: \"status\",\n className: screenReaderStyles.screenReader,\n \"data-ppui\": \"true\"\n }, children, \" \", screenReaderTextElement) : null;\n return /*#__PURE__*/React.createElement(React.Fragment, null, iconMarkup, children, /*#__PURE__*/React.createElement(AffordanceIcon, {\n isMenu: isMenu,\n isOpen: isOpen,\n isSmall: isSizeSmall,\n className: styles.affordance,\n \"data-ppui\": \"true\"\n }), stateOverlay, assistiveText);\n }());\n if (isSizeSmall) {\n return /*#__PURE__*/React.createElement(as || 'button', _extends({\n className: cx(styles.smallSizeTapContainer, btnState === 'initial' && styles.cursorPointer, className)\n }, componentProps, {\n \"data-ppui\": \"true\"\n }), buttonComponent);\n }\n return buttonComponent;\n});\n\nvar ButtonGroup = function (_ref) {\n var className = _ref.className,\n _ref$fullWidthOnMobil = _ref.fullWidthOnMobile,\n fullWidthOnMobile = _ref$fullWidthOnMobil === void 0 ? true : _ref$fullWidthOnMobil,\n children = _ref.children;\n var childArray = Children.toArray(children);\n var breakPointValue = parseInt(breakpoints.mediaSm, 10) * 16;\n var innerWidth = hasWindow() && window.innerWidth;\n var computedChildren = children;\n if (breakPointValue && innerWidth > breakPointValue) {\n computedChildren = childArray.reverse();\n }\n var buttonGroupClassNames = cx(childArray.length && styles.buttonGroup[childArray.length], fullWidthOnMobile && styles.btnGroupFullWidth, className);\n return /*#__PURE__*/React.createElement(\"div\", {\n className: buttonGroupClassNames,\n \"data-ppui\": \"true\"\n }, computedChildren);\n};\n\nexport { Button, ButtonGroup };\n"],"names":["focusOffsetElementStyles","fadeIn","keyframes","opacity","displayFlex","display","alignItems","justifyContent","getButtonGroupStyles","buttonCount","style","gridTemplateColumns","gap","space","padding","btnBase","position","borderRadius","borderStyle","borderWidth","border","thickness","normal","cursor","textDecoration","transition","motion","duration","action","btnLarge","minWidth","emphasis","minHeight","size","tapTarget","default","btnSmall","tiny","indicator","md","buttonsType","primary","color","fallbackVar","background","contrast","main","backgroundColor","hoverMain","hoverBack","mainHover","borderColor","activeMain","outline","activeBack","mainActive","primaryInverse","contrastHover","contrastActive","secondary","structure","borderLowContrast","highContrast","secondaryInverse","tertiary","link","radius","sm","overlay","overlayInverse","tertiarySmall","icon","marginInlineEnd","affordance","marginInlineStart","verticalAlign","pointerEvents","successState","success","processingState","btnOverlay","top","bottom","left","right","textAlign","animation","hover","paddingRight","successStateOverlay","successStateIcon","successStateIconSm","btnFullWidth","mediaMd","width","smallSizeTapContainer","mediaSm","height","cursorPointer","globalStyle","_excluded","_excluded2","ownKeys","e","r","t","Object","keys","getOwnPropertySymbols","o","filter","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","arguments","length","forEach","getOwnPropertyDescriptors","defineProperties","defineProperty","buttonVariantStyles","AffordanceIcon","_ref","isMenu","isOpen","isSmall","className","rest","Icon","Button","forwardRef","_ref2","ref","variant","inverse","_ref2$btnState","btnState","screenReaderText","children","as","iconComponent","_ref2$fullWidthOnMobi","fullWidthOnMobile","isSizeSmall","isStateInitial","componentProps","undefined","Component","buttonComponent","classNames","customClassName","colorStyles","includes","concat","getVariantStyles","cx","_colorStyles","isSecondary","isInverse","getButtonTypeStyles","id","screenReaderTextElement","successIconClassNames","buttonCheckmarkIcon","iconMarkup","loadingSpinnerProps","overlayClassNames","stateOverlay","assistiveText","role"],"sourceRoot":""}