From 14ca0d7f7dac1490e0c6c784d90a6738e4a0f9a7 Mon Sep 17 00:00:00 2001
From: Tom Ross <tom@umpox.com>
Date: Tue, 25 Jan 2022 11:03:10 +0000
Subject: [PATCH] web: remove duplicate `as` props in Wildcard (#30164)

---
 client/wildcard/src/components/Alert/Alert.tsx             | 1 -
 client/wildcard/src/components/Button/Button.tsx           | 7 -------
 .../src/components/Button/story/ButtonVariants.tsx         | 2 +-
 .../wildcard/src/components/Card/components/CardBody.tsx   | 7 +------
 .../wildcard/src/components/Card/components/CardHeader.tsx | 7 +------
 .../wildcard/src/components/Card/components/CardList.tsx   | 7 +------
 .../src/components/Card/components/CardSubtitle.tsx        | 7 +------
 .../wildcard/src/components/Card/components/CardText.tsx   | 7 +------
 .../wildcard/src/components/Card/components/CardTitle.tsx  | 7 +------
 9 files changed, 7 insertions(+), 45 deletions(-)

diff --git a/client/wildcard/src/components/Alert/Alert.tsx b/client/wildcard/src/components/Alert/Alert.tsx
index 9ad0969cc7b..7366148f6eb 100644
--- a/client/wildcard/src/components/Alert/Alert.tsx
+++ b/client/wildcard/src/components/Alert/Alert.tsx
@@ -9,7 +9,6 @@ import { getAlertStyle } from './utils'
 
 export interface AlertProps extends React.HTMLAttributes<HTMLDivElement> {
     variant?: typeof ALERT_VARIANTS[number]
-    as?: React.ElementType
 }
 
 export const Alert = React.forwardRef(
diff --git a/client/wildcard/src/components/Button/Button.tsx b/client/wildcard/src/components/Button/Button.tsx
index 36df793ac9f..1202053b0eb 100644
--- a/client/wildcard/src/components/Button/Button.tsx
+++ b/client/wildcard/src/components/Button/Button.tsx
@@ -21,13 +21,6 @@ export interface ButtonProps
      * Modifies the button style to have a transparent/light background and a more pronounced outline.
      */
     outline?: boolean
-    /**
-     * Used to change the element that is rendered.
-     * Useful if needing to style a link as a button, or in certain cases where a different element is required.
-     * Always be mindful of potentially accessibiliy pitfalls when using this!
-     * Note: This component assumes `HTMLButtonElement` types, providing a different component here will change the potential types that can be passed to this component.
-     */
-    as?: React.ElementType
 }
 
 /**
diff --git a/client/wildcard/src/components/Button/story/ButtonVariants.tsx b/client/wildcard/src/components/Button/story/ButtonVariants.tsx
index c35c4aa5f35..43739ab11d9 100644
--- a/client/wildcard/src/components/Button/story/ButtonVariants.tsx
+++ b/client/wildcard/src/components/Button/story/ButtonVariants.tsx
@@ -7,7 +7,7 @@ import { BUTTON_VARIANTS } from '../constants'
 
 import styles from './ButtonVariants.module.scss'
 
-interface ButtonVariantsProps extends Pick<ButtonProps, 'size' | 'outline' | 'as'> {
+interface ButtonVariantsProps extends Pick<ButtonProps, 'size' | 'outline'> {
     variants: readonly typeof BUTTON_VARIANTS[number][]
     icon?: React.ComponentType<{ className?: string }>
 }
diff --git a/client/wildcard/src/components/Card/components/CardBody.tsx b/client/wildcard/src/components/Card/components/CardBody.tsx
index a36a852bbe0..7087f0d4d04 100644
--- a/client/wildcard/src/components/Card/components/CardBody.tsx
+++ b/client/wildcard/src/components/Card/components/CardBody.tsx
@@ -5,12 +5,7 @@ import { ForwardReferenceComponent } from '../../..'
 
 import styles from './CardBody.module.scss'
 
-interface CardBodyProps {
-    /**
-     * Used to change the element that is rendered.
-     */
-    as?: React.ElementType
-}
+interface CardBodyProps {}
 
 export const CardBody = React.forwardRef(({ as: Component = 'div', children, className, ...attributes }, reference) => (
     <Component ref={reference} className={classNames(styles.cardBody, className)} {...attributes}>
diff --git a/client/wildcard/src/components/Card/components/CardHeader.tsx b/client/wildcard/src/components/Card/components/CardHeader.tsx
index 7326e137db7..2b8f99307ad 100644
--- a/client/wildcard/src/components/Card/components/CardHeader.tsx
+++ b/client/wildcard/src/components/Card/components/CardHeader.tsx
@@ -5,12 +5,7 @@ import { ForwardReferenceComponent } from '../../..'
 
 import styles from './CardHeader.module.scss'
 
-interface CardHeaderProps {
-    /**
-     * Used to change the element that is rendered.
-     */
-    as?: React.ElementType
-}
+interface CardHeaderProps {}
 
 export const CardHeader = React.forwardRef(
     ({ as: Component = 'div', children, className, ...attributes }, reference) => (
diff --git a/client/wildcard/src/components/Card/components/CardList.tsx b/client/wildcard/src/components/Card/components/CardList.tsx
index b4349a1716e..f7b228c1749 100644
--- a/client/wildcard/src/components/Card/components/CardList.tsx
+++ b/client/wildcard/src/components/Card/components/CardList.tsx
@@ -5,12 +5,7 @@ import { ForwardReferenceComponent } from '../../..'
 
 import styles from './CardList.module.scss'
 
-interface CardListProps {
-    /**
-     * Used to change the element that is rendered.
-     */
-    as?: React.ElementType
-}
+interface CardListProps {}
 
 export const CardList = React.forwardRef(({ as: Component = 'div', children, className, ...attributes }, reference) => (
     <Component ref={reference} className={classNames(styles.listGroup, className)} {...attributes}>
diff --git a/client/wildcard/src/components/Card/components/CardSubtitle.tsx b/client/wildcard/src/components/Card/components/CardSubtitle.tsx
index e97d754fe3b..fa3f5de131d 100644
--- a/client/wildcard/src/components/Card/components/CardSubtitle.tsx
+++ b/client/wildcard/src/components/Card/components/CardSubtitle.tsx
@@ -5,12 +5,7 @@ import { ForwardReferenceComponent } from '../../..'
 
 import styles from './CardSubtitle.module.scss'
 
-interface CardSubtitleProps {
-    /**
-     * Used to change the element that is rendered.
-     */
-    as?: React.ElementType
-}
+interface CardSubtitleProps {}
 
 export const CardSubtitle = React.forwardRef(
     ({ as: Component = 'div', children, className, ...attributes }, reference) => (
diff --git a/client/wildcard/src/components/Card/components/CardText.tsx b/client/wildcard/src/components/Card/components/CardText.tsx
index a4f4fc6b7b1..a246b7d5b60 100644
--- a/client/wildcard/src/components/Card/components/CardText.tsx
+++ b/client/wildcard/src/components/Card/components/CardText.tsx
@@ -5,12 +5,7 @@ import { ForwardReferenceComponent } from '../../..'
 
 import styles from './CardText.module.scss'
 
-interface CardTextProps {
-    /**
-     * Used to change the element that is rendered.
-     */
-    as?: React.ElementType
-}
+interface CardTextProps {}
 
 export const CardText = React.forwardRef(({ as: Component = 'p', children, className, ...attributes }, reference) => (
     <Component ref={reference} className={classNames(styles.cardText, className)} {...attributes}>
diff --git a/client/wildcard/src/components/Card/components/CardTitle.tsx b/client/wildcard/src/components/Card/components/CardTitle.tsx
index 3b865aa912d..883edf1d413 100644
--- a/client/wildcard/src/components/Card/components/CardTitle.tsx
+++ b/client/wildcard/src/components/Card/components/CardTitle.tsx
@@ -5,12 +5,7 @@ import { ForwardReferenceComponent } from '../../..'
 
 import styles from './CardTitle.module.scss'
 
-interface CardTitleProps {
-    /**
-     * Used to change the element that is rendered.
-     */
-    as?: React.ElementType
-}
+interface CardTitleProps {}
 
 export const CardTitle = React.forwardRef(({ as: Component = 'h3', children, className, ...attributes }, reference) => (
     <Component ref={reference} className={classNames(styles.cardTitle, className)} {...attributes}>