import React from 'react';
import { Typography } from '../../../..';
import { StyledNestedBadge, StyledFallback, StyledFlag, StyledImg, StyledOverlay } from './NestedBadge.styles';
var isValidCountry = function isValidCountry(country) {
  return ['SE', 'DK', 'FI', 'NO', 'US', 'DE', 'CA', 'GB'].includes(country);
};
export var NestedBadge = function NestedBadge(_ref) {
  var alt = _ref.alt,
    _ref$badgeSize = _ref.badgeSize,
    badgeSize = _ref$badgeSize === void 0 ? 'l' : _ref$badgeSize,
    className = _ref.className,
    country = _ref.country,
    fallback = _ref.fallback,
    logoUrl = _ref.logoUrl;
  return React.createElement(StyledNestedBadge, {
    $badgeSize: badgeSize,
    className: className
  }, logoUrl ? React.createElement(StyledImg, {
    src: "".concat(logoUrl, "?w=48&q=90"),
    alt: alt || fallback || logoUrl,
    $badgeSize: badgeSize
  }) : React.createElement(StyledFallback, {
    $badgeSize: badgeSize
  }, React.createElement(Typography, {
    type: "secondary",
    weight: "bold",
    color: function color(t) {
      return t.colorTokens.neutral.text_default;
    }
  }, fallback === null || fallback === void 0 ? void 0 : fallback.charAt(0).toUpperCase())), country && isValidCountry(country) && React.createElement(React.Fragment, null, React.createElement(StyledFlag, {
    country: country,
    size: "m",
    $badgeSize: badgeSize
  }), React.createElement(StyledOverlay, {
    $badgeSize: badgeSize
  })));
};