"use strict";

import { Platform, StyleSheet, View } from "react-native";
import { useIOTheme } from "../../context";
import { IOColors, IOTagHSpacing, IOTagRadius, IOTagVSpacing, IOThemeLight } from "../../core";
import { useIOFontDynamicScale } from "../../utils/accessibility";
import { Icon } from "../icons";
import { IOText } from "../typography";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
const IconColorsMap = {
  primary: "interactiveElem-default",
  warning: "warningIcon",
  error: "errorIcon",
  success: "successIcon",
  info: "infoIcon",
  grey: "icon-default",
  lightGrey: "icon-decorative"
};
const IOTagIconMargin = 6;
const IOTagIconSize = 16;
const styles = StyleSheet.create({
  tag: {
    alignSelf: "flex-start",
    flexDirection: "row",
    alignItems: "center",
    justifyContent: "center",
    ...Platform.select({
      android: {
        textAlignVertical: "center"
      }
    }),
    overflow: "hidden",
    borderWidth: 1,
    borderCurve: "continuous"
  },
  tagStatic: {
    borderRadius: IOTagRadius,
    borderCurve: "continuous",
    paddingHorizontal: IOTagHSpacing,
    paddingVertical: IOTagVSpacing,
    columnGap: IOTagIconMargin
  },
  iconWrapper: {
    flexShrink: 0
  }
});
const getVariantProps = (variant, customIcon) => {
  if (variant === "custom" && customIcon) {
    return customIcon;
  }
  switch (variant) {
    case "qrCode":
      return {
        color: "primary",
        name: "qrCode"
      };
    case "attachment":
      return {
        color: "grey",
        name: "attachment"
      };
    case "legalMessage":
      return {
        color: "primary",
        name: "legalValue"
      };
    case "info":
      return {
        color: "info",
        name: "infoFilled"
      };
    case "warning":
      return {
        color: "warning",
        name: "warningFilled"
      };
    case "error":
      return {
        color: "error",
        name: "errorFilled"
      };
    case "success":
      return {
        color: "success",
        name: "success"
      };
    case "noIcon":
      return undefined;
    default:
      return undefined;
  }
};

/**
 * Tag component, used mainly for message list and details
 */
export const Tag = ({
  text,
  variant,
  testID,
  icon,
  iconAccessibilityLabel,
  allowFontScaling = true,
  forceLightMode = false
}) => {
  const theme = useIOTheme();
  const {
    dynamicFontScale,
    spacingScaleMultiplier
  } = useIOFontDynamicScale();
  const variantProps = getVariantProps(variant, icon);
  const borderColor = forceLightMode ? IOColors[IOThemeLight["cardBorder-default"]] : IOColors[theme["cardBorder-default"]];
  const backgroundColor = forceLightMode ? IOColors[IOThemeLight["appBackground-primary"]] : IOColors[theme["appBackground-primary"]];
  const tagDynamic = {
    paddingHorizontal: IOTagHSpacing * dynamicFontScale,
    paddingVertical: IOTagVSpacing * dynamicFontScale,
    columnGap: IOTagIconMargin * dynamicFontScale * spacingScaleMultiplier,
    borderRadius: IOTagRadius * dynamicFontScale
  };
  return /*#__PURE__*/_jsxs(View, {
    testID: testID,
    style: [styles.tag, allowFontScaling ? tagDynamic : styles.tagStatic, {
      borderColor,
      backgroundColor
    }],
    children: [variantProps && /*#__PURE__*/_jsx(View, {
      style: styles.iconWrapper,
      children: /*#__PURE__*/_jsx(Icon, {
        allowFontScaling: allowFontScaling,
        name: variantProps.name,
        color: forceLightMode ? IOThemeLight[IconColorsMap[variantProps.color]] : theme[IconColorsMap[variantProps.color]],
        size: IOTagIconSize,
        accessible: !!iconAccessibilityLabel,
        accessibilityLabel: iconAccessibilityLabel
      })
    }), text && /*#__PURE__*/_jsx(IOText, {
      allowFontScaling: allowFontScaling,
      weight: "Semibold",
      size: 12,
      lineHeight: 16,
      color: forceLightMode ? IOThemeLight["textBody-tertiary"] : theme["textBody-tertiary"],
      numberOfLines: 1,
      ellipsizeMode: "tail",
      style: {
        alignSelf: "center",
        textTransform: "uppercase",
        letterSpacing: 0.5,
        flexShrink: 1
      },
      children: text
    })]
  });
};
//# sourceMappingURL=Tag.js.map