From 06af55e9bd84aba2ab73dda6c79de158edf0a908 Mon Sep 17 00:00:00 2001
From: Luke Walczak <lukasz.walczak.pwr@gmail.com>
Date: Mon, 23 Jan 2023 14:02:50 +0100
Subject: [PATCH] fix: adjust label and icon props optionality (#3613)

---
 src/components/FAB/AnimatedFAB.tsx |  2 +-
 src/components/FAB/FAB.tsx         | 20 ++++++++++++++++----
 2 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/src/components/FAB/AnimatedFAB.tsx b/src/components/FAB/AnimatedFAB.tsx
index 8e4e46f460..ecaf547033 100644
--- a/src/components/FAB/AnimatedFAB.tsx
+++ b/src/components/FAB/AnimatedFAB.tsx
@@ -91,7 +91,7 @@ export type Props = $RemoveChildren<typeof Surface> & {
    */
   extended: boolean;
   /**
-   * @supported Available in v3.x with theme version 3
+   * @supported Available in v5.x with theme version 3
    *
    * Color mappings variant for combinations of container and icon colors.
    */
diff --git a/src/components/FAB/FAB.tsx b/src/components/FAB/FAB.tsx
index 788b9945f4..5fab41db2f 100644
--- a/src/components/FAB/FAB.tsx
+++ b/src/components/FAB/FAB.tsx
@@ -23,13 +23,25 @@ type FABSize = 'small' | 'medium' | 'large';
 
 type FABMode = 'flat' | 'elevated';
 
+type IconOrLabel =
+  | {
+      icon: IconSource;
+      label?: string;
+    }
+  | {
+      icon?: IconSource;
+      label: string;
+    };
+
 export type Props = $RemoveChildren<typeof Surface> & {
+  // For `icon` and `label` props their types are duplicated due to the generation of documentation.
+  // Appropriate type for them is `IconOrLabel` contains the both union and intersection types.
   /**
-   * Icon to display for the `FAB`.
+   * Icon to display for the `FAB`. It's optional only if `label` is defined.
    */
-  icon: IconSource;
+  icon?: IconSource;
   /**
-   * Optional label for extended `FAB`.
+   * Optional label for extended `FAB`. It's optional only if `icon` is defined.
    */
   label?: string;
   /**
@@ -117,7 +129,7 @@ export type Props = $RemoveChildren<typeof Surface> & {
   theme?: ThemeProp;
   testID?: string;
   ref?: React.RefObject<View>;
-};
+} & IconOrLabel;
 
 /**
  * A floating action button represents the primary action in an application.