feat(component): add html anchor props

bigcommerce · Oct 28, 2024 · e3cc66d · e3cc66d
1 parent 015bf00
commit e3cc66d
Showing 1 changed file with 15 additions and 4 deletions.
diff --git a/packages/big-design/src/components/FeatureTag/FeatureTag.tsx b/packages/big-design/src/components/FeatureTag/FeatureTag.tsx
@@ -1,17 +1,28 @@
 import { IconProps } from '@bigcommerce/big-design-icons';
-import React, { FunctionComponent, HTMLAttributes, ReactElement } from 'react';
+import React, { AnchorHTMLAttributes, FunctionComponent, ReactElement } from 'react';
 
 import { StyledFeatureTag, StyledFeatureTagIcon, StyledFeatureTagLabel } from './styled';
 
-export interface FeatureTagProps extends HTMLAttributes<HTMLAnchorElement> {
+export interface FeatureTagProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
   icon?: ReactElement<IconProps>;
   isActive?: boolean;
   label: string;
 }
 
-export const FeatureTag: FunctionComponent<FeatureTagProps> = ({ label, icon, isActive }) => {
+export const FeatureTag: FunctionComponent<FeatureTagProps> = ({
+  label,
+  icon,
+  isActive,
+  href,
+  target,
+}) => {
   return label ? (
-    <StyledFeatureTag className={isActive ? 'active' : ''} title={label}>
+    <StyledFeatureTag
+      className={isActive ? 'active' : ''}
+      href={href}
+      target={target}
+      title={label}
+    >
       {icon ? <StyledFeatureTagIcon>{icon}</StyledFeatureTagIcon> : null}
       <StyledFeatureTagLabel>{label}</StyledFeatureTagLabel>
     </StyledFeatureTag>