✨ Added anchor style prop

README.md

@@ -50,8 +50,9 @@ You can customize almost every aspect of this component using the below props, o
 | children  	|  ReactNode  	|  null 	|  Use this if you want to use some custom component inside the anchor tag. 	|
 | defaultTooltip  	|   string	|   "Copy email address"	|   Text shown in the tooltip when the user hovers over the link.	|
 | copiedTooltip 	|   string	|   "Copied to clipboard!"	|   Text shown in the tooltip when the user clicks on the link and the text is copied to clipboard.	|
-| containerStyles  	|   style object	|   none	|   The styles to be applied to the anchor container	|
+| containerStyles  	|   style object	|   none	|   The styles to be applied to the container	|
 | tooltipStyles  	|   style object	|   none	|   The styles to be applied to the tooltip	|
+| anchorStyles  	|   style object	|   none	|   The styles to be applied to the anchor	|
 
 ## Development
 

src/lib/index.tsx

@@ -57,13 +57,15 @@ const CopyMailTo = ({
   copiedTooltip = "Copied to clipboard!",
   containerStyles = {},
   tooltipStyles = {},
+  anchorStyles = {},
 }: {
   email: string;
   children?: React.ReactNode;
   defaultTooltip?: string;
   copiedTooltip?: string;
   containerStyles?: React.CSSProperties;
   tooltipStyles?: React.CSSProperties;
+  anchorStyles?: React.CSSProperties;
 }): JSX.Element => {
   const [showCopied, setShowCopied] = React.useState(false);
   const [showTooltip, setShowTooltip] = React.useState(false);
@@ -112,6 +114,7 @@ const CopyMailTo = ({
         onFocus={displayTooltip}
         onBlur={hideTooltip}
         href={`mailto:${email}`}
+        style={anchorStyles}
       >
         {children || email}
       </a>