From 5024086d958ed7c237b49d5ee6fbff0965eca331 Mon Sep 17 00:00:00 2001
From: Vitaly Rtishchev <rtivital@gmail.com>
Date: Thu, 15 Sep 2022 18:21:39 +0400
Subject: [PATCH] [@mantine/core] SegmetedControl: Fix floating indicator being
 invisible in uncontrolled component (#2454)

---
 .../src/SegmentedControl/SegmentedControl.story.tsx           | 4 ++++
 src/mantine-core/src/SegmentedControl/SegmentedControl.tsx    | 2 +-
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/mantine-core/src/SegmentedControl/SegmentedControl.story.tsx b/src/mantine-core/src/SegmentedControl/SegmentedControl.story.tsx
index 54cbf346103..0f389e5d5e1 100644
--- a/src/mantine-core/src/SegmentedControl/SegmentedControl.story.tsx
+++ b/src/mantine-core/src/SegmentedControl/SegmentedControl.story.tsx
@@ -28,3 +28,7 @@ export function EmptyStringValue() {
     />
   );
 }
+
+export function InvisibleIndicator() {
+  return <SegmentedControl color="cyan" data={data} />;
+}
diff --git a/src/mantine-core/src/SegmentedControl/SegmentedControl.tsx b/src/mantine-core/src/SegmentedControl/SegmentedControl.tsx
index 33424d4b265..58ae48dbca4 100644
--- a/src/mantine-core/src/SegmentedControl/SegmentedControl.tsx
+++ b/src/mantine-core/src/SegmentedControl/SegmentedControl.tsx
@@ -212,7 +212,7 @@ export const SegmentedControl = forwardRef<HTMLDivElement, SegmentedControlProps
 
   return (
     <Box className={cx(classes.root, className)} ref={useMergedRef(observerRef, ref)} {...others}>
-      {typeof value === 'string' && shouldAnimate && (
+      {typeof _value === 'string' && shouldAnimate && (
         <Box
           component="span"
           className={classes.active}