18 lines
682 B
TypeScript
18 lines
682 B
TypeScript
import { useTranslation } from "react-i18next";
|
|
import tw, { TwStyle } from "twin.macro";
|
|
import "styled-components/macro";
|
|
import { ComponentProps, forwardRef } from "react";
|
|
|
|
export const Badge = forwardRef<HTMLParagraphElement, { color: string | TwStyle, text: string | number }>(({ color, text, ...props }, ref) => {
|
|
const colors = {
|
|
yellow: tw`bg-yellow-500`,
|
|
gray: tw`bg-gray-500`,
|
|
red: tw`bg-red-700`,
|
|
};
|
|
|
|
const realColor = (typeof (color) === "string" && color in colors) ? colors[color] : color;
|
|
|
|
return (
|
|
<p ref={ref} css={[tw`px-2 py-1 inline text-primary text-xs font-semibold uppercase rounded-full `, realColor]} {...props}>{text}</p>
|
|
);
|
|
}); |