fix(Stack): spread inline styles

carbon-design-system · Nov 13, 2024 · fd5787f · fd5787f
1 parent ad23c63
commit fd5787f
Showing 1 changed file with 29 additions and 28 deletions.
diff --git a/packages/react/src/components/Stack/Stack.tsx b/packages/react/src/components/Stack/Stack.tsx
@@ -71,35 +71,36 @@ export interface StackProps extends React.HTMLAttributes<HTMLElement> {
  * - https://paste.twilio.design/layout/stack/
  * - https://github.com/Workday/canvas-kit/blob/f2f599654876700f483a1d8c5de82a41315c76f1/modules/labs-react/layout/lib/Stack.tsx
  */
-const Stack = React.forwardRef<React.ReactNode, StackProps>(
-  function Stack(props, ref) {
-    const {
-      as: BaseComponent = 'div',
-      children,
-      className: customClassName,
-      gap,
-      orientation = 'vertical',
-      ...rest
-    } = props;
-    const prefix = usePrefix();
-    const className = cx(customClassName, {
-      [`${prefix}--stack-${orientation}`]: true,
-      [`${prefix}--stack-scale-${gap}`]: typeof gap === 'number',
-    });
-    const style = {};
-
-    if (typeof gap === 'string') {
-      style[`--${prefix}-stack-gap`] = gap;
-    }
-
-    return (
-      // eslint-disable-next-line react/forbid-component-props
-      <BaseComponent {...rest} ref={ref} className={className} style={style}>
-        {children}
-      </BaseComponent>
-    );
+const Stack = React.forwardRef<React.ReactNode, StackProps>(function Stack(
+  props,
+  ref
+) {
+  const {
+    as: BaseComponent = 'div',
+    children,
+    className: customClassName,
+    gap,
+    orientation = 'vertical',
+    ...rest
+  } = props;
+  const prefix = usePrefix();
+  const className = cx(customClassName, {
+    [`${prefix}--stack-${orientation}`]: true,
+    [`${prefix}--stack-scale-${gap}`]: typeof gap === 'number',
+  });
+  const style = { ...rest.style };
+
+  if (typeof gap === 'string') {
+    style[`--${prefix}-stack-gap`] = gap;
   }
-);
+
+  return (
+    // eslint-disable-next-line react/forbid-component-props
+    <BaseComponent {...rest} ref={ref} className={className} style={style}>
+      {children}
+    </BaseComponent>
+  );
+});
 
 Stack.propTypes = {
   /**