fix: style more priority

- Fixes #7829
VKCOM · Oct 28, 2024 · bd6f6c1 · bd6f6c1
1 parent e6ce861
commit bd6f6c1
Show file tree

Hide file tree

Showing 7 changed files with 14 additions and 26 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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
@@ -166,14 +166,14 @@ export const Popper = ({
       baseClassName={styles.host}
       getRootRef={handleRootRef}
       style={{
-        ...styleProp,
         ...convertFloatingDataToReactCSSProperties(
           floatingPositionStrategy,
           floatingDataX,
           floatingDataY,
           sameWidth ? null : undefined,
           middlewareData,
         ),
+        ...styleProp,
       }}
     >
       {arrow && (

diff --git 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
@@ -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(