how to change button style by props? [closed]

I want to pass a theme as a parameter to my component button but the style is not being applied

My Component:

interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {  theme: string}const Button: React.FC<ButtonProps> = ({ children, theme }) => {  return (<Container type="button" theme={theme}>      {children}</Container>  )}

Styles file:

const theme = {  blue: {    default: '#3f51b5',    hover: '#283593'  },  pink: {    default: '#e91e63',    hover: '#ad1457'  }}export const Container = styled.button`  display: flex;  justify-content: center;  background: ${props => theme[props.theme].defautl};

My index:

<Button theme="pink">Click</Button>

does anyone know where the error is or how can i do this?