From bd6f6c1a30aad98ac3e32d31e8d216feb1310206 Mon Sep 17 00:00:00 2001
From: Daniil Suvorov <severecloud@gmail.com>
Date: Mon, 28 Oct 2024 11:01:15 +0300
Subject: [PATCH] fix: style more priority - Fixes #7829

---
 .../src/components/FixedLayout/FixedLayout.tsx     |  2 +-
 .../vkui/src/components/FormField/FormField.tsx    | 12 ++++--------
 packages/vkui/src/components/List/List.tsx         |  2 +-
 .../src/components/ModalCardBase/ModalCardBase.tsx |  2 +-
 packages/vkui/src/components/Popper/Popper.tsx     |  2 +-
 packages/vkui/src/components/Progress/Progress.tsx | 14 +++-----------
 packages/vkui/src/components/SplitCol/SplitCol.tsx |  6 +++---
 7 files changed, 14 insertions(+), 26 deletions(-)

diff --git a/packages/vkui/src/components/FixedLayout/FixedLayout.tsx b/packages/vkui/src/components/FixedLayout/FixedLayout.tsx
index b36eedeaa6..906c4821d0 100644
--- a/packages/vkui/src/components/FixedLayout/FixedLayout.tsx
+++ b/packages/vkui/src/components/FixedLayout/FixedLayout.tsx
@@ -107,7 +107,7 @@ export const FixedLayout = ({
         vertical && stylesVertical[vertical],
         className,
       )}
-      style={{ ...style, width }}
+      style={{ width, ...style }}
     >
       {children}
     </OnboardingTooltipContainer>
diff --git a/packages/vkui/src/components/FormField/FormField.tsx b/packages/vkui/src/components/FormField/FormField.tsx
index bd262c1a3a..73393b8c99 100644
--- a/packages/vkui/src/components/FormField/FormField.tsx
+++ b/packages/vkui/src/components/FormField/FormField.tsx
@@ -127,14 +127,10 @@ export const FormField = ({
     <Component
       {...restProps}
       ref={elRef}
-      style={
-        maxHeight !== undefined
-          ? {
-              ...style,
-              maxHeight,
-            }
-          : style
-      }
+      style={{
+        maxHeight,
+        ...style,
+      }}
       onMouseEnter={handleMouseEnter}
       onMouseLeave={handleMouseLeave}
       className={classNames(
diff --git a/packages/vkui/src/components/List/List.tsx b/packages/vkui/src/components/List/List.tsx
index 14a860484f..67bf6b2ad9 100644
--- a/packages/vkui/src/components/List/List.tsx
+++ b/packages/vkui/src/components/List/List.tsx
@@ -27,8 +27,8 @@ export const List = ({
       role="list"
       className={classNames(styles.host, className)}
       style={{
-        ...style,
         gridGap: gap,
+        ...style,
       }}
       {...restProps}
     >
diff --git a/packages/vkui/src/components/ModalCardBase/ModalCardBase.tsx b/packages/vkui/src/components/ModalCardBase/ModalCardBase.tsx
index 7915b62017..9480c3cdfe 100644
--- a/packages/vkui/src/components/ModalCardBase/ModalCardBase.tsx
+++ b/packages/vkui/src/components/ModalCardBase/ModalCardBase.tsx
@@ -126,8 +126,8 @@ export const ModalCardBase = ({
         withSafeZone && styles.withSafeZone,
       )}
       style={{
-        ...style,
         maxWidth: size,
+        ...style,
       }}
     >
       <div
diff --git a/packages/vkui/src/components/Popper/Popper.tsx b/packages/vkui/src/components/Popper/Popper.tsx
index 145f0bfe94..5764fe936d 100644
--- a/packages/vkui/src/components/Popper/Popper.tsx
+++ b/packages/vkui/src/components/Popper/Popper.tsx
@@ -166,7 +166,6 @@ export const Popper = ({
       baseClassName={styles.host}
       getRootRef={handleRootRef}
       style={{
-        ...styleProp,
         ...convertFloatingDataToReactCSSProperties(
           floatingPositionStrategy,
           floatingDataX,
@@ -174,6 +173,7 @@ export const Popper = ({
           sameWidth ? null : undefined,
           middlewareData,
         ),
+        ...styleProp,
       }}
     >
       {arrow && (
diff --git a/packages/vkui/src/components/Progress/Progress.tsx b/packages/vkui/src/components/Progress/Progress.tsx
index 32b525dff5..bf2f9d4577 100644
--- a/packages/vkui/src/components/Progress/Progress.tsx
+++ b/packages/vkui/src/components/Progress/Progress.tsx
@@ -20,13 +20,6 @@ function progressCustomHeightStyle(height: number | undefined): React.CSSPropert
     : undefined;
 }
 
-function progressStyle(height: number | undefined, styleProps: React.CSSProperties | undefined) {
-  const styleHeight = progressCustomHeightStyle(height);
-  const style = styleHeight ? { ...styleProps, ...styleHeight } : styleProps;
-
-  return style;
-}
-
 export interface ProgressProps extends HTMLAttributesWithRootRef<HTMLDivElement> {
   /**
    * Стиль отображения прогрессбара
@@ -49,19 +42,18 @@ export const Progress = ({
   value = 0,
   appearance = 'accent',
   height,
-  style: styleProps,
+  style,
   ...restProps
 }: ProgressProps): React.ReactNode => {
   const progress = clamp(value, PROGRESS_MIN_VALUE, PROGRESS_MAX_VALUE);
   const title = `${progress} / ${PROGRESS_MAX_VALUE}`;
-
-  const style = progressStyle(height, styleProps);
+  const styleHeight = progressCustomHeightStyle(height);
 
   return (
     <RootComponent
       aria-valuenow={value}
       title={title}
-      style={style}
+      style={{ ...styleHeight, ...style }}
       {...restProps}
       role="progressbar"
       aria-valuemin={PROGRESS_MIN_VALUE}
diff --git a/packages/vkui/src/components/SplitCol/SplitCol.tsx b/packages/vkui/src/components/SplitCol/SplitCol.tsx
index a2b6cb610f..6a5d63b8d8 100644
--- a/packages/vkui/src/components/SplitCol/SplitCol.tsx
+++ b/packages/vkui/src/components/SplitCol/SplitCol.tsx
@@ -98,10 +98,10 @@ export const SplitCol = (props: SplitColProps): React.ReactNode => {
     <RootComponent
       {...restProps}
       style={{
+        width,
+        maxWidth,
+        minWidth,
         ...style,
-        width: width,
-        maxWidth: maxWidth,
-        minWidth: minWidth,
       }}
       getRootRef={baseRef}
       baseClassName={classNames(