fix: Steps keyboard switch (#43644)

components/steps/style/index.tsx

@@ -1,6 +1,6 @@
 import type { CSSObject } from '@ant-design/cssinjs';
 import type { CSSProperties } from 'react';
-import { resetComponent } from '../../style';
+import { genFocusOutline, resetComponent } from '../../style';
 import type { FullToken, GenerateStyle } from '../../theme/internal';
 import { genComponentStyleHook, mergeToken } from '../../theme/internal';
 import genStepsCustomIconStyle from './custom-icon';
@@ -171,6 +171,7 @@ const genStepsItemStatusStyle = (status: StepItemStatusEnum, token: StepsToken):
 const genStepsItemStyle: GenerateStyle<StepsToken, CSSObject> = (token) => {
   const { componentCls, motionDurationSlow } = token;
   const stepsItemCls = `${componentCls}-item`; // .ant-steps-item
+  const stepItemIconCls = `${stepsItemCls}-icon`;
 
   return {
     [stepsItemCls]: {
@@ -189,12 +190,18 @@ const genStepsItemStyle: GenerateStyle<StepsToken, CSSObject> = (token) => {
     },
     [`${stepsItemCls}-container`]: {
       outline: 'none',
+
+      [`&:focus-visible`]: {
+        [stepItemIconCls]: {
+          ...genFocusOutline(token),
+        },
+      },
     },
-    [`${stepsItemCls}-icon, ${stepsItemCls}-content`]: {
+    [`${stepItemIconCls}, ${stepsItemCls}-content`]: {
       display: 'inline-block',
       verticalAlign: 'top',
     },
-    [`${stepsItemCls}-icon`]: {
+    [stepItemIconCls]: {
       width: token.iconSize,
       height: token.iconSize,
       marginTop: 0,

package.json

@@ -144,7 +144,7 @@
     "rc-segmented": "~2.2.0",
     "rc-select": "~14.5.0",
     "rc-slider": "~10.1.0",
-    "rc-steps": "~6.0.0",
+    "rc-steps": "~6.0.1",
     "rc-switch": "~4.1.0",
     "rc-table": "~7.32.1",
     "rc-tabs": "~12.9.0",