fix: form responsive logic (#39130)

components/form/style/index.tsx

@@ -404,9 +404,7 @@ const makeVerticalLayout = (token: FormToken): CSSObject => {
   const { componentCls, formItemCls } = token;
 
   return {
-    [`${formItemCls} ${formItemCls}-label`]: {
-      ...makeVerticalLayoutLabel(token),
-    },
+    [`${formItemCls} ${formItemCls}-label`]: makeVerticalLayoutLabel(token),
     [componentCls]: {
       [formItemCls]: {
         flexWrap: 'wrap',
@@ -443,40 +441,32 @@ const genVerticalStyle: GenerateStyle<FormToken> = (token) => {
 
     [`${componentCls}-vertical ${formItemCls}-label,
       .${rootPrefixCls}-col-24${formItemCls}-label,
-      .${rootPrefixCls}-col-xl-24${formItemCls}-label`]: {
-      ...makeVerticalLayoutLabel(token),
-    },
+      .${rootPrefixCls}-col-xl-24${formItemCls}-label`]: makeVerticalLayoutLabel(token),
 
-    [`@media (max-width: ${token.screenSMMax}px)`]: {
-      ...makeVerticalLayout(token),
-      [componentCls]: {
-        [`.${rootPrefixCls}-col-xs-24${formItemCls}-label`]: {
-          ...makeVerticalLayoutLabel(token),
+    [`@media (max-width: ${token.screenXSMax}px)`]: [
+      makeVerticalLayout(token),
+      {
+        [componentCls]: {
+          [`.${rootPrefixCls}-col-xs-24${formItemCls}-label`]: makeVerticalLayoutLabel(token),
         },
       },
-    },
+    ],
 
     [`@media (max-width: ${token.screenSMMax}px)`]: {
       [componentCls]: {
-        [`.${rootPrefixCls}-col-sm-24${formItemCls}-label`]: {
-          ...makeVerticalLayoutLabel(token),
-        },
+        [`.${rootPrefixCls}-col-sm-24${formItemCls}-label`]: makeVerticalLayoutLabel(token),
       },
     },
 
     [`@media (max-width: ${token.screenMDMax}px)`]: {
       [componentCls]: {
-        [`.${rootPrefixCls}-col-md-24${formItemCls}-label`]: {
-          ...makeVerticalLayoutLabel(token),
-        },
+        [`.${rootPrefixCls}-col-md-24${formItemCls}-label`]: makeVerticalLayoutLabel(token),
       },
     },
 
     [`@media (max-width: ${token.screenLGMax}px)`]: {
       [componentCls]: {
-        [`.${rootPrefixCls}-col-lg-24${formItemCls}-label`]: {
-          ...makeVerticalLayoutLabel(token),
-        },
+        [`.${rootPrefixCls}-col-lg-24${formItemCls}-label`]: makeVerticalLayoutLabel(token),
       },
     },
   };

components/theme/interface/alias.ts

@@ -166,7 +166,6 @@ export interface AliasToken extends MapToken {
   screenXLMax: number;
   screenXXL: number;
   screenXXLMin: number;
-  screenXXLMax: number;
 
   /** Used for DefaultButton, Switch which has default outline */
   controlTmpOutline: string;

components/theme/util/alias.ts

@@ -158,22 +158,21 @@ export default function formatToken(derivativeToken: RawMergedToken): AliasToken
 
     screenXS,
     screenXSMin: screenXS,
-    screenXSMax: screenXS - 1,
+    screenXSMax: screenSM - 1,
     screenSM,
     screenSMMin: screenSM,
-    screenSMMax: screenSM - 1,
+    screenSMMax: screenMD - 1,
     screenMD,
     screenMDMin: screenMD,
-    screenMDMax: screenMD - 1,
+    screenMDMax: screenLG - 1,
     screenLG,
     screenLGMin: screenLG,
-    screenLGMax: screenLG - 1,
+    screenLGMax: screenXL - 1,
     screenXL,
     screenXLMin: screenXL,
-    screenXLMax: screenXL - 1,
+    screenXLMax: screenXXL - 1,
     screenXXL,
     screenXXLMin: screenXXL,
-    screenXXLMax: screenXXL - 1,
 
     // FIXME: component box-shadow, should be removed
     boxShadowPopoverArrow: `3px 3px 7px rgba(0, 0, 0, 0.1)`,