fix(css): return undefined if there is no className

Author: logonoff

packages/react-core/src/components/List/__tests__/Generated/__snapshots__/ListItem.test.tsx.snap

@@ -2,9 +2,7 @@
 
 exports[`ListItem should match snapshot (auto-generated) 1`] = `
 <DocumentFragment>
-  <li
-    class=""
-  >
+  <li>
     <span>
       ReactNode
     </span>

packages/react-core/src/components/List/__tests__/__snapshots__/List.test.tsx.snap

@@ -183,23 +183,17 @@ exports[`List inline list 1`] = `
     <ul
       class="pf-v6-c-list"
     >
-      <li
-        class=""
-      >
+      <li>
         <span>
           First
         </span>
       </li>
-      <li
-        class=""
-      >
+      <li>
         <span>
           Second
         </span>
       </li>
-      <li
-        class=""
-      >
+      <li>
         <span>
           Third
         </span>
@@ -215,23 +209,17 @@ exports[`List ordered list 1`] = `
     class="pf-v6-c-list"
     type="1"
   >
-    <li
-      class=""
-    >
+    <li>
       <span>
         Apple
       </span>
     </li>
-    <li
-      class=""
-    >
+    <li>
       <span>
         Banana
       </span>
     </li>
-    <li
-      class=""
-    >
+    <li>
       <span>
         Orange
       </span>
@@ -248,23 +236,17 @@ exports[`List simple list 1`] = `
     <ul
       class="pf-v6-c-list"
     >
-      <li
-        class=""
-      >
+      <li>
         <span>
           First
         </span>
       </li>
-      <li
-        class=""
-      >
+      <li>
         <span>
           Second
         </span>
       </li>
-      <li
-        class=""
-      >
+      <li>
         <span>
           Third
         </span>

packages/react-core/src/components/Nav/__tests__/__snapshots__/Nav.test.tsx.snap

@@ -1014,7 +1014,6 @@ exports[`Nav Nav List with flyout 1`] = `
       </li>
     </ul>
     <div
-      class=""
       data-popper-escaped="true"
       data-popper-placement="right-start"
       data-popper-reference-hidden="true"

packages/react-core/src/components/SearchInput/__tests__/__snapshots__/SearchInput.test.tsx.snap

@@ -2,9 +2,7 @@
 
 exports[`SearchInput advanced search 1`] = `
 <DocumentFragment>
-  <div
-    class=""
-  >
+  <div>
     <div
       class="pf-v6-c-input-group"
     >
@@ -145,7 +143,6 @@ exports[`SearchInput advanced search 1`] = `
 exports[`SearchInput advanced search with custom attributes 1`] = `
 <DocumentFragment>
   <div
-    class=""
     data-testid="test-id"
   >
     <div
@@ -282,7 +279,6 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
       </div>
     </div>
     <div
-      class=""
       data-popper-escaped="true"
       data-popper-placement="bottom-start"
       data-popper-reference-hidden="true"
@@ -478,9 +474,7 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
 
 exports[`SearchInput renders search input in strict mode 1`] = `
 <DocumentFragment>
-  <div
-    class=""
-  >
+  <div>
     <div
       class="pf-v6-c-input-group"
     >

packages/react-core/src/components/ToggleGroup/__tests__/__snapshots__/ToggleGroupItemElement.test.tsx.snap

@@ -2,9 +2,7 @@
 
 exports[`empty 1`] = `
 <DocumentFragment>
-  <span
-    class=""
-  />
+  <span />
 </DocumentFragment>
 `;
 

packages/react-core/src/layouts/Flex/__tests__/__snapshots__/Flex.test.tsx.snap

@@ -8,9 +8,7 @@ exports[`Flex Nested flex 1`] = `
     <div
       class="pf-v6-l-flex"
     >
-      <div
-        class=""
-      >
+      <div>
         Test
       </div>
     </div>
@@ -23,9 +21,7 @@ exports[`Flex Simple flex with single item 1`] = `
   <div
     class="pf-v6-l-flex"
   >
-    <div
-      class=""
-    >
+    <div>
       Test
     </div>
   </div>
@@ -37,9 +33,7 @@ exports[`Flex alternative component 1`] = `
   <ul
     class="pf-v6-l-flex"
   >
-    <li
-      class=""
-    >
+    <li>
       Test
     </li>
   </ul>

packages/react-drag-drop/src/components/DragDrop/__tests__/__snapshots__/DragDrop.test.tsx.snap

@@ -6,9 +6,7 @@ exports[`renders some divs 1`] = `
     class="pf-c-droppable pf-m-dragging"
   >
     <div>
-      <div
-        class=""
-      >
+      <div>
         <button
           aria-describedby="DndDescribedBy-0"
           aria-disabled="false"
@@ -46,9 +44,7 @@ exports[`renders some divs 1`] = `
         </button>
         one
       </div>
-      <div
-        class=""
-      >
+      <div>
         <button
           aria-describedby="DndDescribedBy-0"
           aria-disabled="false"
@@ -86,9 +82,7 @@ exports[`renders some divs 1`] = `
         </button>
         two
       </div>
-      <div
-        class=""
-      >
+      <div>
         <button
           aria-describedby="DndDescribedBy-0"
           aria-disabled="false"

packages/react-styles/src/index.ts

@@ -2,8 +2,8 @@
  *
  * @param {any} args list of objects, string, or arrays to reduce
  */
-export function css(...args: any): string {
-  // Adapted from https://github.com/JedWatson/classnames/blob/master/index.js
+export function css(...args: any): string | undefined {
+  // Adapted from https://github.com/JedWatson/classnames/blob/main/index.js
   const classes = [] as string[];
   const hasOwn = {}.hasOwnProperty;
 
@@ -26,5 +26,5 @@ export function css(...args: any): string {
     }
   });
 
-  return classes.join(' ');
+  return classes.join(' ') || undefined;
 }