import React from 'react';
import { SBox } from '../../../common/s-components/layout/s-box';
import { SPersonalizedLabel } from '../../s-components/card/s-personalized-label';

type TProps = {
  text?: string;
};

export const Personalized: React.FC<TProps> = props => {
  const { text } = props;
  return (
    <SBox
      px={8}
      borderRadius={2}
      backgroundColor="purpleHeart2"
      height={24}
      justifyContent="center"
    >
      <SPersonalizedLabel>{text}</SPersonalizedLabel>
    </SBox>
  );
};

Personalized.defaultProps = {
  text: '',
};