"use strict";

import { useIOFontDynamicScale } from "../../utils/accessibility";
import { findFirstCaseInsensitive } from "../../utils/object";
import { Icon } from "../icons";
import { IOPaymentExtLogos, IOPaymentLogos, LogoPayment, LogoPaymentExt } from "../logos";
import { jsx as _jsx } from "react/jsx-runtime";
/**
 * This component renders either
 * - a LogoPayment/LogoPaymentExt component
 * - a default credit card icon
 * @param cardIcon: IOLogoPaymentType icon
 * @param size: the size of the icon (standard is 24/48)
 * @param fallbackIconColor: default icon color (standard is grey-700)
 * @param isExtended: if true, renders a LogoPaymentExt component
 * @returns a LogoPayment/LogopaymentExt component if the cardIcon is supported, a default credit card icon otherwise
 */
export const LogoPaymentWithFallback = ({
  brand,
  fallbackIconColor = "grey-700",
  isExtended = false,
  size = isExtended ? 48 : 24
}) => {
  const {
    dynamicFontScale
  } = useIOFontDynamicScale();
  const logos = isExtended ? IOPaymentExtLogos : IOPaymentLogos;
  if (!brand) {
    return /*#__PURE__*/_jsx(Icon, {
      allowFontScaling: true,
      name: "creditCard",
      size: size,
      color: fallbackIconColor
    });
  }
  const findCase = findFirstCaseInsensitive(logos, brand);
  if (!findCase) {
    return /*#__PURE__*/_jsx(Icon, {
      allowFontScaling: true,
      name: "creditCard",
      size: size,
      color: fallbackIconColor
    });
  }
  return isExtended ? /*#__PURE__*/_jsx(LogoPaymentExt, {
    name: findCase,
    size: size * dynamicFontScale
  }) : /*#__PURE__*/_jsx(LogoPayment, {
    name: findCase,
    size: size * dynamicFontScale
  });
};
//# sourceMappingURL=LogoPaymentWithFallback.js.map