From 30f8a782c340b2148df2876b2cd7b927c6e09142 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tom=C3=A1=C5=A1=20Sl=C3=A1ma?= <tomas.slama@toptal.com>
Date: Fri, 16 Aug 2024 15:54:36 +0200
Subject: [PATCH] Fix types for mui@4 tabs (#4484)

---
 .changeset/slow-gifts-hang.md        | 5 +++++
 packages/base/Tabs/package.json      | 2 +-
 packages/base/Tabs/src/Tabs/Tabs.tsx | 2 +-
 packages/base/Tabs/src/Tabs/test.tsx | 6 +++---
 4 files changed, 10 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/slow-gifts-hang.md

diff --git a/.changeset/slow-gifts-hang.md b/.changeset/slow-gifts-hang.md
new file mode 100644
index 0000000000..aae9344813
--- /dev/null
+++ b/.changeset/slow-gifts-hang.md
@@ -0,0 +1,5 @@
+---
+'@toptal/picasso-tabs': patch
+---
+
+- fix value type from `null` to `false` when empty
diff --git a/packages/base/Tabs/package.json b/packages/base/Tabs/package.json
index 32cf5b14eb..0c199a5f98 100644
--- a/packages/base/Tabs/package.json
+++ b/packages/base/Tabs/package.json
@@ -46,7 +46,7 @@
   },
   "devDependencies": {
     "@toptal/picasso-provider": "5.0.0",
-    "@toptal/picasso-tailwind-merge": "1.2.0",
+    "@material-ui/core": "4.12.4",
     "@toptal/picasso-test-utils": "1.1.1"
   },
   "files": [
diff --git a/packages/base/Tabs/src/Tabs/Tabs.tsx b/packages/base/Tabs/src/Tabs/Tabs.tsx
index dcac04114d..4e58ff0a0e 100644
--- a/packages/base/Tabs/src/Tabs/Tabs.tsx
+++ b/packages/base/Tabs/src/Tabs/Tabs.tsx
@@ -9,7 +9,7 @@ import { TabScrollButton } from '../TabScrollButton'
 import styles from './styles'
 import useTabAction from './use-tab-action'
 
-export type TabsValueType = string | number | null
+export type TabsValueType = string | number | false
 
 export interface Props<V extends TabsValueType> extends BaseProps {
   /** Tabs content containing Tab components */
diff --git a/packages/base/Tabs/src/Tabs/test.tsx b/packages/base/Tabs/src/Tabs/test.tsx
index f3a0363308..514f8b488b 100644
--- a/packages/base/Tabs/src/Tabs/test.tsx
+++ b/packages/base/Tabs/src/Tabs/test.tsx
@@ -60,7 +60,7 @@ describe('Tabs', () => {
     const { container, queryByTestId } = renderTabs(
       [{ label: 'Tab 1' }, { label: 'Tab 2' }],
       {
-        value: null,
+        value: false,
       }
     )
 
@@ -73,7 +73,7 @@ describe('Tabs', () => {
   it('renders in vertical orientation', () => {
     const { container } = renderTabs(
       [{ label: 'Tab 1' }, { label: 'Tab 2' }],
-      { value: null },
+      { value: false },
       'vertical'
     )
 
@@ -159,7 +159,7 @@ describe('Tabs', () => {
 
   it('renders in full width', () => {
     const { container } = renderTabs([{ label: 'Tab 1' }, { label: 'Tab 2' }], {
-      value: null,
+      value: false,
       variant: 'fullWidth',
     })