Deprecations, October 2021 Edition

src-docs/src/views/card/card_beta.js

@@ -17,12 +17,12 @@ const cardNodes = icons.map(function (item, index) {
         icon={<EuiIcon size="xxl" type={`${item}App`} />}
         title={`Kibana ${item}`}
         description="Example of a card's description. Stick to one or two sentences."
-        betaBadgeLabel={badges[index]}
-        betaBadgeTooltipContent={
-          badges[index]
+        betaBadgeProps={{
+          label: badges[index],
+          tooltipContent: badges[index]
             ? 'This module is not GA. Please help us by reporting any bugs.'
-            : undefined
-        }
+            : undefined,
+        }}
         onClick={() => {}}
       />
     </EuiFlexItem>
@@ -41,9 +41,9 @@ export default () => (
         betaBadgeProps={{
           href: 'http://www.elastic.co/subscriptions',
           target: '_blank',
+          label: 'Basic',
+          tooltipContent: 'This feature requires a Basic License',
         }}
-        betaBadgeLabel="Basic"
-        betaBadgeTooltipContent="This feature requires a Basic License"
         onClick={() => {}}
       />
     </EuiFlexItem>

src-docs/src/views/card/card_display.js

@@ -38,8 +38,11 @@ export default () => (
           title="Transparent"
           display="transparent"
           description="This one doesn't have a background color anymore."
-          betaBadgeLabel="Beta"
-          betaBadgeTooltipContent="This module is not GA. Please help us by reporting any bugs."
+          betaBadgeProps={{
+            label: 'Beta',
+            tooltipContent:
+              'This module is not GA. Please help us by reporting any bugs.',
+          }}
           onClick={() => {}}
         />
       </EuiFlexItem>

src-docs/src/views/card/card_example.js

@@ -242,11 +242,11 @@ export const CardExample = {
       text: (
         <p>
           If the card links to or references a module that is not GA (beta, lab,
-          etc), you can add a <EuiCode>betaBadgeLabel</EuiCode> and{' '}
-          <EuiCode>betaBadgeTooltipContent</EuiCode> to the card and it will
-          properly create and position an <strong>EuiBetaBadge</strong>. If you
-          want to change the title of the tooltip, supply a{' '}
-          <EuiCode>betaBadgeTitle</EuiCode> prop.
+          etc), you can add a <EuiCode>betaBadgeProps.label</EuiCode> and{' '}
+          <EuiCode>betaBadgeProps.tooltipContent</EuiCode> to the card and it
+          will properly create and position an <strong>EuiBetaBadge</strong>. If
+          you want to change the title of the tooltip, supply a{' '}
+          <EuiCode>betaBadgeProps.title</EuiCode> prop.
         </p>
       ),
       props: { EuiCard },
@@ -259,8 +259,10 @@ export const CardExample = {
   title="title"
   description="description"
   onClick={handleClick}
-  betaBadgeLabel="betaBadgeLabel"
-  betaBadgeTooltipContent={betaBadgeTooltipContent}
+  betaBadgeProps={{
+    label: 'betaBadgeLabel',
+    toolTipContent: 'betaBadgeTooltipContent',
+  }}
 />`,
     },
     {

src-docs/src/views/card/playground.js

@@ -52,11 +52,6 @@ export const cardConfig = () => {
     type: PropTypes.String,
   };
 
-  propsToUse.betaBadgeTooltipContent = {
-    ...propsToUse.betaBadgeTooltipContent,
-    type: PropTypes.String,
-  };
-
   propsToUse.onClick = simulateFunction(propsToUse.onClick);
   propsToUse.display = createOptionalEnum(propsToUse.display);
 

src/components/card/card.test.tsx

@@ -292,8 +292,8 @@ describe('EuiCard', () => {
         description="Card description"
         betaBadgeProps={{
           href: 'http://www.elastic.co/',
+          label: 'Link',
         }}
-        betaBadgeLabel="Link"
       />
     );
 

src/components/card/card.tsx

@@ -121,24 +121,9 @@ export type EuiCardProps = Omit<CommonProps, 'aria-label'> &
     href?: string;
     target?: string;
     rel?: string;
-
-    /**
-     * Add a badge to the card to label it as "Beta" or other non-GA state
-     * **DEPRECATED: Use `betaBadgeProps.label` instead.**
-     */
-    betaBadgeLabel?: string;
-
-    /**
-     * Add a description to the beta badge (will appear in a tooltip)
-     * **DEPRECATED: Use `betaBadgeProps.tooltipContent` instead.**
-     */
-    betaBadgeTooltipContent?: ReactNode;
-
     /**
-     * Optional title will be supplied as tooltip title or title attribute otherwise the label will be used.
-     * **DEPRECATED: Use `betaBadgeProps.title` instead.**
+     * Props to be passed through to the EuiBetaBadge
      */
-    betaBadgeTitle?: string;
     betaBadgeProps?: Partial<EuiBetaBadgeProps>;
     /**
      * Matches to the color property of EuiPanel. If defined, removes any border & shadow.
@@ -186,9 +171,6 @@ export const EuiCard: FunctionComponent<EuiCardProps> = ({
   rel,
   target,
   textAlign = 'center',
-  betaBadgeLabel,
-  betaBadgeTooltipContent,
-  betaBadgeTitle,
   betaBadgeProps,
   layout = 'vertical',
   selectable,
@@ -234,10 +216,10 @@ export const EuiCard: FunctionComponent<EuiCardProps> = ({
     layoutToClassNameMap[layout],
     {
       'euiCard--isClickable': isClickable,
-      'euiCard--hasBetaBadge': betaBadgeLabel,
+      'euiCard--hasBetaBadge': betaBadgeProps?.label,
       'euiCard--hasIcon': icon,
       'euiCard--isSelectable': selectable,
-      'euiCard-isSelected': selectable && selectable.isSelected,
+      'euiCard-isSelected': selectable?.isSelected,
       'euiCard-isDisabled': isDisabled,
     },
     selectableColorClass,
@@ -287,16 +269,13 @@ export const EuiCard: FunctionComponent<EuiCardProps> = ({
 
   let optionalBetaBadge;
   let optionalBetaBadgeID = '';
-  if (betaBadgeLabel) {
+  if (betaBadgeProps?.label) {
     optionalBetaBadgeID = `${ariaId}BetaBadge`;
     optionalBetaBadge = (
       <span className="euiCard__betaBadgeWrapper">
         <EuiBetaBadge
           id={optionalBetaBadgeID}
           {...(betaBadgeProps as EuiBetaBadgeProps)}
-          label={betaBadgeLabel}
-          title={betaBadgeTitle}
-          tooltipContent={betaBadgeTooltipContent}
           className={classNames(
             'euiCard__betaBadge',
             betaBadgeProps?.className