From bc17268ff9ce1d151ed72671dcdb0dccc31f90c3 Mon Sep 17 00:00:00 2001
From: Jony J <1844749591@qq.com>
Date: Mon, 23 Dec 2024 14:17:42 +0800
Subject: [PATCH] feat(segmented): enhance name prop behavior and adjust focus
 style (#52085)

* feat(segmented): enhance name prop behavior and adjust focus style

* test: update snapshot
---
 .../__snapshots__/demo-extend.test.ts.snap    |  2 +
 .../__snapshots__/demo-extend.test.ts.snap    |  9 +++
 .../__tests__/__snapshots__/demo.test.ts.snap |  9 +++
 .../__snapshots__/demo-extend.test.ts.snap    |  3 +
 .../__snapshots__/demo.test.tsx.snap          |  3 +
 .../__snapshots__/demo-extend.test.ts.snap    |  3 +
 .../__snapshots__/demo.test.tsx.snap          |  3 +
 .../__snapshots__/demo-extend.test.ts.snap    |  6 ++
 .../__tests__/__snapshots__/demo.test.ts.snap |  6 ++
 .../__snapshots__/demo-extend.test.ts.snap    | 70 +++++++++++++++++++
 .../__tests__/__snapshots__/demo.test.ts.snap | 70 +++++++++++++++++++
 .../__snapshots__/index.test.tsx.snap         | 40 +++++++++++
 components/segmented/index.en-US.md           |  2 +-
 components/segmented/index.tsx                |  5 ++
 components/segmented/index.zh-CN.md           |  2 +-
 components/segmented/style/index.ts           |  3 +-
 .../__snapshots__/demo-extend.test.ts.snap    |  3 +
 .../__tests__/__snapshots__/demo.test.ts.snap |  3 +
 .../__snapshots__/demo-extend.test.ts.snap    |  3 +
 .../__snapshots__/demo.test.tsx.snap          |  3 +
 20 files changed, 245 insertions(+), 3 deletions(-)

diff --git a/components/color-picker/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/color-picker/__tests__/__snapshots__/demo-extend.test.ts.snap
index 95e40bc56f..528b82de68 100644
--- a/components/color-picker/__tests__/__snapshots__/demo-extend.test.ts.snap
+++ b/components/color-picker/__tests__/__snapshots__/demo-extend.test.ts.snap
@@ -3993,6 +3993,7 @@ exports[`renders components/color-picker/demo/line-gradient.tsx extend context c
                         <input
                           checked=""
                           class="ant-segmented-item-input"
+                          name="test-id"
                           type="radio"
                         />
                         <div
@@ -4008,6 +4009,7 @@ exports[`renders components/color-picker/demo/line-gradient.tsx extend context c
                       >
                         <input
                           class="ant-segmented-item-input"
+                          name="test-id"
                           type="radio"
                         />
                         <div
diff --git a/components/flex/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/flex/__tests__/__snapshots__/demo-extend.test.ts.snap
index 65fa6ddb4d..8d3d4f769f 100644
--- a/components/flex/__tests__/__snapshots__/demo-extend.test.ts.snap
+++ b/components/flex/__tests__/__snapshots__/demo-extend.test.ts.snap
@@ -22,6 +22,7 @@ exports[`renders components/flex/demo/align.tsx extend context correctly 1`] = `
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -37,6 +38,7 @@ exports[`renders components/flex/demo/align.tsx extend context correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -52,6 +54,7 @@ exports[`renders components/flex/demo/align.tsx extend context correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -67,6 +70,7 @@ exports[`renders components/flex/demo/align.tsx extend context correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -82,6 +86,7 @@ exports[`renders components/flex/demo/align.tsx extend context correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -97,6 +102,7 @@ exports[`renders components/flex/demo/align.tsx extend context correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -127,6 +133,7 @@ exports[`renders components/flex/demo/align.tsx extend context correctly 1`] = `
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -142,6 +149,7 @@ exports[`renders components/flex/demo/align.tsx extend context correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -157,6 +165,7 @@ exports[`renders components/flex/demo/align.tsx extend context correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
diff --git a/components/flex/__tests__/__snapshots__/demo.test.ts.snap b/components/flex/__tests__/__snapshots__/demo.test.ts.snap
index 3d730e67f0..fc09c0e0ab 100644
--- a/components/flex/__tests__/__snapshots__/demo.test.ts.snap
+++ b/components/flex/__tests__/__snapshots__/demo.test.ts.snap
@@ -22,6 +22,7 @@ exports[`renders components/flex/demo/align.tsx correctly 1`] = `
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -37,6 +38,7 @@ exports[`renders components/flex/demo/align.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -52,6 +54,7 @@ exports[`renders components/flex/demo/align.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -67,6 +70,7 @@ exports[`renders components/flex/demo/align.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -82,6 +86,7 @@ exports[`renders components/flex/demo/align.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -97,6 +102,7 @@ exports[`renders components/flex/demo/align.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -127,6 +133,7 @@ exports[`renders components/flex/demo/align.tsx correctly 1`] = `
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -142,6 +149,7 @@ exports[`renders components/flex/demo/align.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -157,6 +165,7 @@ exports[`renders components/flex/demo/align.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
diff --git a/components/form/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/form/__tests__/__snapshots__/demo-extend.test.ts.snap
index 2a0b9aded8..56b2900ce1 100644
--- a/components/form/__tests__/__snapshots__/demo-extend.test.ts.snap
+++ b/components/form/__tests__/__snapshots__/demo-extend.test.ts.snap
@@ -30867,6 +30867,7 @@ exports[`renders components/form/demo/variant.tsx extend context correctly 1`] =
                 >
                   <input
                     class="ant-segmented-item-input"
+                    name="test-id"
                     type="radio"
                   />
                   <div
@@ -30883,6 +30884,7 @@ exports[`renders components/form/demo/variant.tsx extend context correctly 1`] =
                   <input
                     checked=""
                     class="ant-segmented-item-input"
+                    name="test-id"
                     type="radio"
                   />
                   <div
@@ -30898,6 +30900,7 @@ exports[`renders components/form/demo/variant.tsx extend context correctly 1`] =
                 >
                   <input
                     class="ant-segmented-item-input"
+                    name="test-id"
                     type="radio"
                   />
                   <div
diff --git a/components/form/__tests__/__snapshots__/demo.test.tsx.snap b/components/form/__tests__/__snapshots__/demo.test.tsx.snap
index acb1d999bf..05ec8e588a 100644
--- a/components/form/__tests__/__snapshots__/demo.test.tsx.snap
+++ b/components/form/__tests__/__snapshots__/demo.test.tsx.snap
@@ -13112,6 +13112,7 @@ exports[`renders components/form/demo/variant.tsx correctly 1`] = `
                 >
                   <input
                     class="ant-segmented-item-input"
+                    name="test-id"
                     type="radio"
                   />
                   <div
@@ -13128,6 +13129,7 @@ exports[`renders components/form/demo/variant.tsx correctly 1`] = `
                   <input
                     checked=""
                     class="ant-segmented-item-input"
+                    name="test-id"
                     type="radio"
                   />
                   <div
@@ -13143,6 +13145,7 @@ exports[`renders components/form/demo/variant.tsx correctly 1`] = `
                 >
                   <input
                     class="ant-segmented-item-input"
+                    name="test-id"
                     type="radio"
                   />
                   <div
diff --git a/components/popover/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/popover/__tests__/__snapshots__/demo-extend.test.ts.snap
index 393bf7f22a..7bf4407597 100644
--- a/components/popover/__tests__/__snapshots__/demo-extend.test.ts.snap
+++ b/components/popover/__tests__/__snapshots__/demo-extend.test.ts.snap
@@ -18,6 +18,7 @@ Array [
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -33,6 +34,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -48,6 +50,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
diff --git a/components/popover/__tests__/__snapshots__/demo.test.tsx.snap b/components/popover/__tests__/__snapshots__/demo.test.tsx.snap
index 2490983a72..5156a56924 100644
--- a/components/popover/__tests__/__snapshots__/demo.test.tsx.snap
+++ b/components/popover/__tests__/__snapshots__/demo.test.tsx.snap
@@ -18,6 +18,7 @@ Array [
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -33,6 +34,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -48,6 +50,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
diff --git a/components/qr-code/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/qr-code/__tests__/__snapshots__/demo-extend.test.ts.snap
index a361fe5902..11ae168172 100644
--- a/components/qr-code/__tests__/__snapshots__/demo-extend.test.ts.snap
+++ b/components/qr-code/__tests__/__snapshots__/demo-extend.test.ts.snap
@@ -401,6 +401,7 @@ exports[`renders components/qr-code/demo/download.tsx extend context correctly 1
           <input
             checked=""
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -416,6 +417,7 @@ exports[`renders components/qr-code/demo/download.tsx extend context correctly 1
         >
           <input
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -490,6 +492,7 @@ Array [
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -505,6 +508,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -520,6 +524,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -535,6 +540,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
diff --git a/components/qr-code/__tests__/__snapshots__/demo.test.ts.snap b/components/qr-code/__tests__/__snapshots__/demo.test.ts.snap
index 102e1c8471..3a42e2c613 100644
--- a/components/qr-code/__tests__/__snapshots__/demo.test.ts.snap
+++ b/components/qr-code/__tests__/__snapshots__/demo.test.ts.snap
@@ -359,6 +359,7 @@ exports[`renders components/qr-code/demo/download.tsx correctly 1`] = `
           <input
             checked=""
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -374,6 +375,7 @@ exports[`renders components/qr-code/demo/download.tsx correctly 1`] = `
         >
           <input
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -446,6 +448,7 @@ Array [
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -461,6 +464,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -476,6 +480,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -491,6 +496,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
diff --git a/components/segmented/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/segmented/__tests__/__snapshots__/demo-extend.test.ts.snap
index 0ed4173016..80f643fe8e 100644
--- a/components/segmented/__tests__/__snapshots__/demo-extend.test.ts.snap
+++ b/components/segmented/__tests__/__snapshots__/demo-extend.test.ts.snap
@@ -16,6 +16,7 @@ exports[`renders components/segmented/demo/basic.tsx extend context correctly 1`
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -31,6 +32,7 @@ exports[`renders components/segmented/demo/basic.tsx extend context correctly 1`
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -46,6 +48,7 @@ exports[`renders components/segmented/demo/basic.tsx extend context correctly 1`
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -61,6 +64,7 @@ exports[`renders components/segmented/demo/basic.tsx extend context correctly 1`
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -76,6 +80,7 @@ exports[`renders components/segmented/demo/basic.tsx extend context correctly 1`
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -108,6 +113,7 @@ exports[`renders components/segmented/demo/block.tsx extend context correctly 1`
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -123,6 +129,7 @@ exports[`renders components/segmented/demo/block.tsx extend context correctly 1`
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -138,6 +145,7 @@ exports[`renders components/segmented/demo/block.tsx extend context correctly 1`
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -170,6 +178,7 @@ exports[`renders components/segmented/demo/componentToken.tsx extend context cor
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -185,6 +194,7 @@ exports[`renders components/segmented/demo/componentToken.tsx extend context cor
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -200,6 +210,7 @@ exports[`renders components/segmented/demo/componentToken.tsx extend context cor
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -215,6 +226,7 @@ exports[`renders components/segmented/demo/componentToken.tsx extend context cor
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -230,6 +242,7 @@ exports[`renders components/segmented/demo/componentToken.tsx extend context cor
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -262,6 +275,7 @@ exports[`renders components/segmented/demo/controlled.tsx extend context correct
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -277,6 +291,7 @@ exports[`renders components/segmented/demo/controlled.tsx extend context correct
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -292,6 +307,7 @@ exports[`renders components/segmented/demo/controlled.tsx extend context correct
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -325,6 +341,7 @@ Array [
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -340,6 +357,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -355,6 +373,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -383,6 +402,7 @@ Array [
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -398,6 +418,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -413,6 +434,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -449,6 +471,7 @@ exports[`renders components/segmented/demo/custom.tsx extend context correctly 1
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -476,6 +499,7 @@ exports[`renders components/segmented/demo/custom.tsx extend context correctly 1
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -507,6 +531,7 @@ exports[`renders components/segmented/demo/custom.tsx extend context correctly 1
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -563,6 +588,7 @@ exports[`renders components/segmented/demo/custom.tsx extend context correctly 1
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -586,6 +612,7 @@ exports[`renders components/segmented/demo/custom.tsx extend context correctly 1
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -609,6 +636,7 @@ exports[`renders components/segmented/demo/custom.tsx extend context correctly 1
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -632,6 +660,7 @@ exports[`renders components/segmented/demo/custom.tsx extend context correctly 1
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -676,6 +705,7 @@ exports[`renders components/segmented/demo/disabled.tsx extend context correctly
           checked=""
           class="ant-segmented-item-input"
           disabled=""
+          name="test-id"
           type="radio"
         />
         <div
@@ -692,6 +722,7 @@ exports[`renders components/segmented/demo/disabled.tsx extend context correctly
         <input
           class="ant-segmented-item-input"
           disabled=""
+          name="test-id"
           type="radio"
         />
         <div
@@ -708,6 +739,7 @@ exports[`renders components/segmented/demo/disabled.tsx extend context correctly
         <input
           class="ant-segmented-item-input"
           disabled=""
+          name="test-id"
           type="radio"
         />
         <div
@@ -735,6 +767,7 @@ exports[`renders components/segmented/demo/disabled.tsx extend context correctly
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -751,6 +784,7 @@ exports[`renders components/segmented/demo/disabled.tsx extend context correctly
         <input
           class="ant-segmented-item-input"
           disabled=""
+          name="test-id"
           type="radio"
         />
         <div
@@ -766,6 +800,7 @@ exports[`renders components/segmented/demo/disabled.tsx extend context correctly
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -782,6 +817,7 @@ exports[`renders components/segmented/demo/disabled.tsx extend context correctly
         <input
           class="ant-segmented-item-input"
           disabled=""
+          name="test-id"
           type="radio"
         />
         <div
@@ -797,6 +833,7 @@ exports[`renders components/segmented/demo/disabled.tsx extend context correctly
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -833,6 +870,7 @@ exports[`renders components/segmented/demo/dynamic.tsx extend context correctly
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -848,6 +886,7 @@ exports[`renders components/segmented/demo/dynamic.tsx extend context correctly
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -863,6 +902,7 @@ exports[`renders components/segmented/demo/dynamic.tsx extend context correctly
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -904,6 +944,7 @@ exports[`renders components/segmented/demo/icon-only.tsx extend context correctl
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -940,6 +981,7 @@ exports[`renders components/segmented/demo/icon-only.tsx extend context correctl
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -996,6 +1038,7 @@ exports[`renders components/segmented/demo/size.tsx extend context correctly 1`]
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1011,6 +1054,7 @@ exports[`renders components/segmented/demo/size.tsx extend context correctly 1`]
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1026,6 +1070,7 @@ exports[`renders components/segmented/demo/size.tsx extend context correctly 1`]
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1041,6 +1086,7 @@ exports[`renders components/segmented/demo/size.tsx extend context correctly 1`]
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1056,6 +1102,7 @@ exports[`renders components/segmented/demo/size.tsx extend context correctly 1`]
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1083,6 +1130,7 @@ exports[`renders components/segmented/demo/size.tsx extend context correctly 1`]
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1098,6 +1146,7 @@ exports[`renders components/segmented/demo/size.tsx extend context correctly 1`]
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1113,6 +1162,7 @@ exports[`renders components/segmented/demo/size.tsx extend context correctly 1`]
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1128,6 +1178,7 @@ exports[`renders components/segmented/demo/size.tsx extend context correctly 1`]
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1143,6 +1194,7 @@ exports[`renders components/segmented/demo/size.tsx extend context correctly 1`]
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1170,6 +1222,7 @@ exports[`renders components/segmented/demo/size.tsx extend context correctly 1`]
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1185,6 +1238,7 @@ exports[`renders components/segmented/demo/size.tsx extend context correctly 1`]
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1200,6 +1254,7 @@ exports[`renders components/segmented/demo/size.tsx extend context correctly 1`]
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1215,6 +1270,7 @@ exports[`renders components/segmented/demo/size.tsx extend context correctly 1`]
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1230,6 +1286,7 @@ exports[`renders components/segmented/demo/size.tsx extend context correctly 1`]
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1268,6 +1325,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx extend context co
           <input
             checked=""
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1283,6 +1341,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx extend context co
         >
           <input
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1298,6 +1357,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx extend context co
         >
           <input
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1336,6 +1396,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx extend context co
           <input
             checked=""
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1351,6 +1412,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx extend context co
         >
           <input
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1366,6 +1428,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx extend context co
         >
           <input
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1403,6 +1466,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx extend context co
           <input
             checked=""
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1418,6 +1482,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx extend context co
         >
           <input
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1433,6 +1498,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx extend context co
         >
           <input
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1587,6 +1653,7 @@ exports[`renders components/segmented/demo/vertical.tsx extend context correctly
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -1623,6 +1690,7 @@ exports[`renders components/segmented/demo/vertical.tsx extend context correctly
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -1676,6 +1744,7 @@ exports[`renders components/segmented/demo/with-icon.tsx extend context correctl
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -1715,6 +1784,7 @@ exports[`renders components/segmented/demo/with-icon.tsx extend context correctl
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
diff --git a/components/segmented/__tests__/__snapshots__/demo.test.ts.snap b/components/segmented/__tests__/__snapshots__/demo.test.ts.snap
index f85552799e..2c3f156683 100644
--- a/components/segmented/__tests__/__snapshots__/demo.test.ts.snap
+++ b/components/segmented/__tests__/__snapshots__/demo.test.ts.snap
@@ -16,6 +16,7 @@ exports[`renders components/segmented/demo/basic.tsx correctly 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -31,6 +32,7 @@ exports[`renders components/segmented/demo/basic.tsx correctly 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -46,6 +48,7 @@ exports[`renders components/segmented/demo/basic.tsx correctly 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -61,6 +64,7 @@ exports[`renders components/segmented/demo/basic.tsx correctly 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -76,6 +80,7 @@ exports[`renders components/segmented/demo/basic.tsx correctly 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -106,6 +111,7 @@ exports[`renders components/segmented/demo/block.tsx correctly 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -121,6 +127,7 @@ exports[`renders components/segmented/demo/block.tsx correctly 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -136,6 +143,7 @@ exports[`renders components/segmented/demo/block.tsx correctly 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -166,6 +174,7 @@ exports[`renders components/segmented/demo/componentToken.tsx correctly 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -181,6 +190,7 @@ exports[`renders components/segmented/demo/componentToken.tsx correctly 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -196,6 +206,7 @@ exports[`renders components/segmented/demo/componentToken.tsx correctly 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -211,6 +222,7 @@ exports[`renders components/segmented/demo/componentToken.tsx correctly 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -226,6 +238,7 @@ exports[`renders components/segmented/demo/componentToken.tsx correctly 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -256,6 +269,7 @@ exports[`renders components/segmented/demo/controlled.tsx correctly 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -271,6 +285,7 @@ exports[`renders components/segmented/demo/controlled.tsx correctly 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -286,6 +301,7 @@ exports[`renders components/segmented/demo/controlled.tsx correctly 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -317,6 +333,7 @@ Array [
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -332,6 +349,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -347,6 +365,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -375,6 +394,7 @@ Array [
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -390,6 +410,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -405,6 +426,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -439,6 +461,7 @@ exports[`renders components/segmented/demo/custom.tsx correctly 1`] = `
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -466,6 +489,7 @@ exports[`renders components/segmented/demo/custom.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -497,6 +521,7 @@ exports[`renders components/segmented/demo/custom.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -553,6 +578,7 @@ exports[`renders components/segmented/demo/custom.tsx correctly 1`] = `
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -576,6 +602,7 @@ exports[`renders components/segmented/demo/custom.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -599,6 +626,7 @@ exports[`renders components/segmented/demo/custom.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -622,6 +650,7 @@ exports[`renders components/segmented/demo/custom.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -664,6 +693,7 @@ exports[`renders components/segmented/demo/disabled.tsx correctly 1`] = `
           checked=""
           class="ant-segmented-item-input"
           disabled=""
+          name="test-id"
           type="radio"
         />
         <div
@@ -680,6 +710,7 @@ exports[`renders components/segmented/demo/disabled.tsx correctly 1`] = `
         <input
           class="ant-segmented-item-input"
           disabled=""
+          name="test-id"
           type="radio"
         />
         <div
@@ -696,6 +727,7 @@ exports[`renders components/segmented/demo/disabled.tsx correctly 1`] = `
         <input
           class="ant-segmented-item-input"
           disabled=""
+          name="test-id"
           type="radio"
         />
         <div
@@ -723,6 +755,7 @@ exports[`renders components/segmented/demo/disabled.tsx correctly 1`] = `
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -739,6 +772,7 @@ exports[`renders components/segmented/demo/disabled.tsx correctly 1`] = `
         <input
           class="ant-segmented-item-input"
           disabled=""
+          name="test-id"
           type="radio"
         />
         <div
@@ -754,6 +788,7 @@ exports[`renders components/segmented/demo/disabled.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -770,6 +805,7 @@ exports[`renders components/segmented/demo/disabled.tsx correctly 1`] = `
         <input
           class="ant-segmented-item-input"
           disabled=""
+          name="test-id"
           type="radio"
         />
         <div
@@ -785,6 +821,7 @@ exports[`renders components/segmented/demo/disabled.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -819,6 +856,7 @@ exports[`renders components/segmented/demo/dynamic.tsx correctly 1`] = `
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -834,6 +872,7 @@ exports[`renders components/segmented/demo/dynamic.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -849,6 +888,7 @@ exports[`renders components/segmented/demo/dynamic.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -888,6 +928,7 @@ exports[`renders components/segmented/demo/icon-only.tsx correctly 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -924,6 +965,7 @@ exports[`renders components/segmented/demo/icon-only.tsx correctly 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -978,6 +1020,7 @@ exports[`renders components/segmented/demo/size.tsx correctly 1`] = `
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -993,6 +1036,7 @@ exports[`renders components/segmented/demo/size.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1008,6 +1052,7 @@ exports[`renders components/segmented/demo/size.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1023,6 +1068,7 @@ exports[`renders components/segmented/demo/size.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1038,6 +1084,7 @@ exports[`renders components/segmented/demo/size.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1065,6 +1112,7 @@ exports[`renders components/segmented/demo/size.tsx correctly 1`] = `
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1080,6 +1128,7 @@ exports[`renders components/segmented/demo/size.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1095,6 +1144,7 @@ exports[`renders components/segmented/demo/size.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1110,6 +1160,7 @@ exports[`renders components/segmented/demo/size.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1125,6 +1176,7 @@ exports[`renders components/segmented/demo/size.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1152,6 +1204,7 @@ exports[`renders components/segmented/demo/size.tsx correctly 1`] = `
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1167,6 +1220,7 @@ exports[`renders components/segmented/demo/size.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1182,6 +1236,7 @@ exports[`renders components/segmented/demo/size.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1197,6 +1252,7 @@ exports[`renders components/segmented/demo/size.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1212,6 +1268,7 @@ exports[`renders components/segmented/demo/size.tsx correctly 1`] = `
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1248,6 +1305,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx correctly 1`] = `
           <input
             checked=""
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1263,6 +1321,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx correctly 1`] = `
         >
           <input
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1278,6 +1337,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx correctly 1`] = `
         >
           <input
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1316,6 +1376,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx correctly 1`] = `
           <input
             checked=""
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1331,6 +1392,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx correctly 1`] = `
         >
           <input
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1346,6 +1408,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx correctly 1`] = `
         >
           <input
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1383,6 +1446,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx correctly 1`] = `
           <input
             checked=""
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1398,6 +1462,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx correctly 1`] = `
         >
           <input
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1413,6 +1478,7 @@ exports[`renders components/segmented/demo/size-consistent.tsx correctly 1`] = `
         >
           <input
             class="ant-segmented-item-input"
+            name="test-id"
             type="radio"
           />
           <div
@@ -1509,6 +1575,7 @@ exports[`renders components/segmented/demo/vertical.tsx correctly 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -1545,6 +1612,7 @@ exports[`renders components/segmented/demo/vertical.tsx correctly 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -1596,6 +1664,7 @@ exports[`renders components/segmented/demo/with-icon.tsx correctly 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -1635,6 +1704,7 @@ exports[`renders components/segmented/demo/with-icon.tsx correctly 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
diff --git a/components/segmented/__tests__/__snapshots__/index.test.tsx.snap b/components/segmented/__tests__/__snapshots__/index.test.tsx.snap
index 8e2d8ff0fc..7f22d6664c 100644
--- a/components/segmented/__tests__/__snapshots__/index.test.tsx.snap
+++ b/components/segmented/__tests__/__snapshots__/index.test.tsx.snap
@@ -29,6 +29,7 @@ exports[`Segmented render label with ReactNode 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -44,6 +45,7 @@ exports[`Segmented render label with ReactNode 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -62,6 +64,7 @@ exports[`Segmented render label with ReactNode 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -95,6 +98,7 @@ exports[`Segmented render segmented ok 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -110,6 +114,7 @@ exports[`Segmented render segmented ok 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -125,6 +130,7 @@ exports[`Segmented render segmented ok 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -155,6 +161,7 @@ exports[`Segmented render segmented with \`block\` 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -170,6 +177,7 @@ exports[`Segmented render segmented with \`block\` 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -185,6 +193,7 @@ exports[`Segmented render segmented with \`block\` 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -215,6 +224,7 @@ exports[`Segmented render segmented with \`size#large\` 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -230,6 +240,7 @@ exports[`Segmented render segmented with \`size#large\` 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -245,6 +256,7 @@ exports[`Segmented render segmented with \`size#large\` 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -275,6 +287,7 @@ exports[`Segmented render segmented with \`size#small\` 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -290,6 +303,7 @@ exports[`Segmented render segmented with \`size#small\` 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -305,6 +319,7 @@ exports[`Segmented render segmented with \`size#small\` 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -335,6 +350,7 @@ exports[`Segmented render segmented with mixed options 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -350,6 +366,7 @@ exports[`Segmented render segmented with mixed options 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -365,6 +382,7 @@ exports[`Segmented render segmented with mixed options 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -395,6 +413,7 @@ exports[`Segmented render segmented with numeric options 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -410,6 +429,7 @@ exports[`Segmented render segmented with numeric options 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -425,6 +445,7 @@ exports[`Segmented render segmented with numeric options 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -440,6 +461,7 @@ exports[`Segmented render segmented with numeric options 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -455,6 +477,7 @@ exports[`Segmented render segmented with numeric options 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -485,6 +508,7 @@ exports[`Segmented render segmented with options null/undefined 1`] = `
         checked=""
         class="ant-segmented-item-input"
         disabled=""
+        name="test-id"
         type="radio"
       />
       <div
@@ -498,6 +522,7 @@ exports[`Segmented render segmented with options null/undefined 1`] = `
       <input
         class="ant-segmented-item-input"
         disabled=""
+        name="test-id"
         type="radio"
       />
       <div
@@ -511,6 +536,7 @@ exports[`Segmented render segmented with options null/undefined 1`] = `
       <input
         class="ant-segmented-item-input"
         disabled=""
+        name="test-id"
         type="radio"
       />
       <div
@@ -539,6 +565,7 @@ exports[`Segmented render segmented with options: disabled 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -555,6 +582,7 @@ exports[`Segmented render segmented with options: disabled 1`] = `
       <input
         class="ant-segmented-item-input"
         disabled=""
+        name="test-id"
         type="radio"
       />
       <div
@@ -570,6 +598,7 @@ exports[`Segmented render segmented with options: disabled 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -600,6 +629,7 @@ exports[`Segmented render segmented with string options 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -615,6 +645,7 @@ exports[`Segmented render segmented with string options 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -630,6 +661,7 @@ exports[`Segmented render segmented with string options 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -660,6 +692,7 @@ exports[`Segmented render segmented with thumb 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -675,6 +708,7 @@ exports[`Segmented render segmented with thumb 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -690,6 +724,7 @@ exports[`Segmented render segmented with thumb 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -720,6 +755,7 @@ exports[`Segmented render segmented: disabled 1`] = `
         checked=""
         class="ant-segmented-item-input"
         disabled=""
+        name="test-id"
         type="radio"
       />
       <div
@@ -736,6 +772,7 @@ exports[`Segmented render segmented: disabled 1`] = `
       <input
         class="ant-segmented-item-input"
         disabled=""
+        name="test-id"
         type="radio"
       />
       <div
@@ -752,6 +789,7 @@ exports[`Segmented render segmented: disabled 1`] = `
       <input
         class="ant-segmented-item-input"
         disabled=""
+        name="test-id"
         type="radio"
       />
       <div
@@ -782,6 +820,7 @@ exports[`Segmented render with icons 1`] = `
       <input
         checked=""
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
@@ -818,6 +857,7 @@ exports[`Segmented render with icons 1`] = `
     >
       <input
         class="ant-segmented-item-input"
+        name="test-id"
         type="radio"
       />
       <div
diff --git a/components/segmented/index.en-US.md b/components/segmented/index.en-US.md
index dfe9ca5d3e..9d33cb6ad4 100644
--- a/components/segmented/index.en-US.md
+++ b/components/segmented/index.en-US.md
@@ -50,7 +50,7 @@ Common props ref：[Common props](/docs/react/common-props)
 | size | The size of the Segmented. | `large` \| `middle` \| `small` | `middle` |  |
 | vertical | Orientation | boolean | `false` | 5.21.0 |
 | value | Currently selected value | string \| number |  |  |
-| name | The `name` property of all `input[type="radio"]` children | string |  | 5.23.0 |
+| name | The `name` property of all `input[type="radio"]` children. if not set, it will fallback to a randomly generated name | string |  | 5.23.0 |
 
 ### SegmentedItemType
 
diff --git a/components/segmented/index.tsx b/components/segmented/index.tsx
index aa75221e80..184498081d 100644
--- a/components/segmented/index.tsx
+++ b/components/segmented/index.tsx
@@ -12,6 +12,7 @@ import { ConfigContext } from '../config-provider';
 import useSize from '../config-provider/hooks/useSize';
 import type { SizeType } from '../config-provider/SizeContext';
 import useStyle from './style';
+import useId from 'rc-util/lib/hooks/useId';
 
 export type { SegmentedValue } from 'rc-segmented';
 
@@ -51,6 +52,8 @@ export interface SegmentedProps<ValueType = RcSegmentedValue>
 }
 
 const InternalSegmented = React.forwardRef<HTMLDivElement, SegmentedProps>((props, ref) => {
+  const defaultName = useId();
+
   const {
     prefixCls: customizePrefixCls,
     className,
@@ -60,6 +63,7 @@ const InternalSegmented = React.forwardRef<HTMLDivElement, SegmentedProps>((prop
     size: customSize = 'middle',
     style,
     vertical,
+    name = defaultName,
     ...restProps
   } = props;
 
@@ -111,6 +115,7 @@ const InternalSegmented = React.forwardRef<HTMLDivElement, SegmentedProps>((prop
   return wrapCSSVar(
     <RcSegmented
       {...restProps}
+      name={name}
       className={cls}
       style={mergedStyle}
       options={extendedOptions}
diff --git a/components/segmented/index.zh-CN.md b/components/segmented/index.zh-CN.md
index f9e159c9ed..b2da01b00f 100644
--- a/components/segmented/index.zh-CN.md
+++ b/components/segmented/index.zh-CN.md
@@ -53,7 +53,7 @@ demo:
 | size | 控件尺寸 | `large` \| `middle` \| `small` | `middle` |  |
 | vertical | 排列方向 | boolean | `false` | 5.21.0 |
 | value | 当前选中的值 | string \| number |  |  |
-| name | Segmented 下所有 `input[type="radio"]` 的 `name` 属性 | string |  | 5.23.0 |
+| name | Segmented 下所有 `input[type="radio"]` 的 `name` 属性。若未设置，则将回退到随机生成的名称 | string |  | 5.23.0 |
 
 ### SegmentedItemType
 
diff --git a/components/segmented/style/index.ts b/components/segmented/style/index.ts
index 11aefce331..9bffe934a7 100644
--- a/components/segmented/style/index.ts
+++ b/components/segmented/style/index.ts
@@ -1,7 +1,7 @@
 import type { CSSObject } from '@ant-design/cssinjs';
 import { unit } from '@ant-design/cssinjs';
 
-import { genFocusOutline, resetComponent, textEllipsis } from '../../style';
+import { genFocusOutline, genFocusStyle, resetComponent, textEllipsis } from '../../style';
 import type { FullToken, GenerateStyle, GetDefaultToken } from '../../theme/internal';
 import { genStyleHooks, mergeToken } from '../../theme/internal';
 
@@ -103,6 +103,7 @@ const genSegmentedStyle: GenerateStyle<SegmentedToken> = (token: SegmentedToken)
       background: token.trackBg,
       borderRadius: token.borderRadius,
       transition: `all ${token.motionDurationMid} ${token.motionEaseInOut}`,
+      ...genFocusStyle(token),
 
       [`${componentCls}-group`]: {
         position: 'relative',
diff --git a/components/tabs/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/tabs/__tests__/__snapshots__/demo-extend.test.ts.snap
index 76452441fa..753db983e3 100644
--- a/components/tabs/__tests__/__snapshots__/demo-extend.test.ts.snap
+++ b/components/tabs/__tests__/__snapshots__/demo-extend.test.ts.snap
@@ -2021,6 +2021,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -2037,6 +2038,7 @@ Array [
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -2052,6 +2054,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
diff --git a/components/tabs/__tests__/__snapshots__/demo.test.ts.snap b/components/tabs/__tests__/__snapshots__/demo.test.ts.snap
index 6b2d9a4542..306022d4c7 100644
--- a/components/tabs/__tests__/__snapshots__/demo.test.ts.snap
+++ b/components/tabs/__tests__/__snapshots__/demo.test.ts.snap
@@ -1690,6 +1690,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1706,6 +1707,7 @@ Array [
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -1721,6 +1723,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
diff --git a/components/tooltip/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/tooltip/__tests__/__snapshots__/demo-extend.test.ts.snap
index 1ac75f31d3..92227c5832 100644
--- a/components/tooltip/__tests__/__snapshots__/demo-extend.test.ts.snap
+++ b/components/tooltip/__tests__/__snapshots__/demo-extend.test.ts.snap
@@ -18,6 +18,7 @@ Array [
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -33,6 +34,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -48,6 +50,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
diff --git a/components/tooltip/__tests__/__snapshots__/demo.test.tsx.snap b/components/tooltip/__tests__/__snapshots__/demo.test.tsx.snap
index 1c95a038a4..ef1ec35bfb 100644
--- a/components/tooltip/__tests__/__snapshots__/demo.test.tsx.snap
+++ b/components/tooltip/__tests__/__snapshots__/demo.test.tsx.snap
@@ -18,6 +18,7 @@ Array [
         <input
           checked=""
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -33,6 +34,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div
@@ -48,6 +50,7 @@ Array [
       >
         <input
           class="ant-segmented-item-input"
+          name="test-id"
           type="radio"
         />
         <div