import React from "react";
import { Text, TextProps } from "@momo-kits/foundation";
import { View, StyleSheet, StyleProp, ViewProps, ViewStyle, TextStyle } from "react-native";

interface IAdBadgeProps extends TextProps {
  allCaps?: boolean;
  textStyle?: StyleProp<TextStyle>
  style?: StyleProp<ViewStyle>
}

const AdBadge = ({allCaps,textStyle,style, ...props}: IAdBadgeProps) => {
  return (
    <View
      style={[
        styles.container,
       style,
      ]}
    >
      <Text
        style={[
          styles.text,
          textStyle,
        ]}
        {...props}
      >
        {allCaps ? 'AD' : 'Ad'}
      </Text>
    </View>
  );
};

export default AdBadge;

const styles = StyleSheet.create({
  container: {
    height: 17,
    width: 21,
    borderWidth: 1,
    borderRadius: 2.5,
    left: 0,
    top: 0,
    justifyContent:'center',
    alignItems:'center',
    paddingHorizontal: 1,
    position:"absolute",

  },
  text: {
    fontSize: 12,
    fontWeight:"bold"
  }
})