react-native-paypal-buttons/lib/module/PaymentButton.js

React native implementation of PayPal Buttons

"use strict";

import { Pressable, Text, Image, StyleSheet } from 'react-native';
import { useState } from 'react';
import { PaymentButtonColor } from './types';
import { getDefaultBorderRadius, getDefaultPadding, getDefaultSpacing } from './utils';
import { getLogoInfo } from './logo';
import { getLabelColor, getLabelMode } from './label';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export const PaymentButton = ({
  fundingSource,
  color: backgroundColor,
  edges,
  label,
  size,
  ...props
}) => {
  const [height, setHeight] = useState(0);
  const logo = getLogoInfo(fundingSource, size, backgroundColor);
  const labelMode = getLabelMode(label, size);
  const borderColor = backgroundColor === PaymentButtonColor.WHITE ? 'black' : backgroundColor;
  const opacity = height === 0 ? 0 : 1;
  const flexDirection = labelMode === 'suffix' ? 'row' : 'row-reverse';
  return /*#__PURE__*/_jsxs(Pressable, {
    ...props,
    onLayout: event => {
      setHeight(event.nativeEvent.layout.height);
      props.onLayout?.(event);
    },
    style: [styles.button, {
      opacity,
      flexDirection,
      backgroundColor,
      ...getDefaultPadding(size),
      borderRadius: getDefaultBorderRadius(edges, height),
      borderColor
    }],
    children: [/*#__PURE__*/_jsx(Image, {
      source: logo.uri,
      resizeMode: "contain",
      style: {
        height: logo.height,
        width: logo.width,
        marginHorizontal: getDefaultSpacing(size)
      }
    }), labelMode !== 'none' && /*#__PURE__*/_jsx(Text, {
      style: [styles.label, {
        color: getLabelColor(backgroundColor)
      }],
      children: label
    })]
  });
};
const styles = StyleSheet.create({
  button: {
    justifyContent: 'center',
    alignItems: 'center',
    borderWidth: 1
  },
  label: {
    fontSize: 14,
    fontFamily: 'PayPalOpen-Regular'
  }
});
//# sourceMappingURL=PaymentButton.js.map