Add missing wide CSS + className to Stack (#4957)

* add missing css + classname

* Create fuzzy-jobs-deny.md

Author: langermank

.changeset/fuzzy-jobs-deny.md

@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+Add missing `wide` CSS + className to Stack

packages/react/src/Stack/Stack.docs.json

@@ -35,6 +35,10 @@
       "name": "padding",
       "type": "'none' | 'condensed' | 'normal' | 'spacious' | ResponsiveValue<'none' | 'condensed' | 'normal' | 'spacious'>",
       "description": "Specify the padding of the stack container."
+    },
+    {
+      "name": "className",
+      "type": "string"
     }
   ],
   "subcomponents": [
@@ -45,6 +49,10 @@
           "name": "grow",
           "type": "boolean | ResponsiveValue<boolean>",
           "description": "Allow item to keep size or expand to fill the available space."
+        },
+        {
+          "name": "className",
+          "type": "string"
         }
       ]
     }

packages/react/src/Stack/Stack.tsx

@@ -281,6 +281,14 @@ const StyledStack = styled.div`
     &[data-justify-wide='space-evenly'] {
       justify-content: space-evenly;
     }
+
+    &[data-wrap-wide='wrap'] {
+      flex-wrap: wrap;
+    }
+
+    &[data-wrap-wide='nowrap'] {
+      flex-wrap: nowrap;
+    }
   }
 `
 
@@ -342,6 +350,7 @@ type StackProps<As> = React.PropsWithChildren<{
    * @default none
    */
   padding?: Padding
+  className?: string
 }>
 
 function Stack<As extends ElementType>({
@@ -353,6 +362,7 @@ function Stack<As extends ElementType>({
   justify = 'start',
   padding = 'none',
   wrap = 'nowrap',
+  className,
   ...rest
 }: StackProps<As> & React.ComponentPropsWithoutRef<ElementType extends As ? As : 'div'>) {
   const BaseComponent = as ?? 'div'
@@ -361,6 +371,7 @@ function Stack<As extends ElementType>({
     <StyledStack
       {...rest}
       as={BaseComponent}
+      className={className}
       {...getResponsiveAttributes('gap', gap)}
       {...getResponsiveAttributes('direction', direction)}
       {...getResponsiveAttributes('align', align)}
@@ -416,18 +427,20 @@ type StackItemProps<As> = React.PropsWithChildren<{
    * @default false
    */
   grow?: boolean | ResponsiveValue<boolean>
+  className?: string
 }>
 
 function StackItem<As extends ElementType>({
   as,
   children,
   grow,
+  className,
   ...rest
 }: StackItemProps<As> & React.ComponentPropsWithoutRef<ElementType extends As ? As : 'div'>) {
   const BaseComponent = as ?? 'div'
 
   return (
-    <StyledStackItem {...rest} as={BaseComponent} {...getResponsiveAttributes('grow', grow)}>
+    <StyledStackItem {...rest} as={BaseComponent} className={className} {...getResponsiveAttributes('grow', grow)}>
       {children}
     </StyledStackItem>
   )