fix(react-aria): removes forcing children on useARIAButton (#18879)

* Removes forcing children on useARIAButton

* Change files

* Fix tests

Author: bsunderhus

change/@fluentui-react-accordion-3bf7f3c8-ac2b-4703-bc89-8d949389d51f.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Forces children prop with Fragment in useAccordionHeader",
+  "packageName": "@fluentui/react-accordion",
+  "email": "bsunderhus@microsoft.com",
+  "dependentChangeType": "patch"
+}

change/@fluentui-react-aria-ddb04cfe-1e14-42cc-b32f-f894317e4e72.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Removes forcing children on useARIAButton",
+  "packageName": "@fluentui/react-aria",
+  "email": "bsunderhus@microsoft.com",
+  "dependentChangeType": "patch"
+}

packages/react-accordion/src/components/AccordionHeader/useAccordionHeader.ts

@@ -44,6 +44,7 @@ export const useAccordionHeader = (props: AccordionHeaderProps, ref: React.Ref<H
     id,
     disabled,
     'aria-controls': panel?.id,
+    children: React.Fragment,
   });
 
   return {

packages/react-aria/src/hooks/useARIAButton.test.tsx

@@ -24,8 +24,6 @@ describe('useARIAButton', () => {
     expect(shorthand.as).toBe('a');
     expect(shorthand.disabled).toBeUndefined();
     expect(shorthand['aria-disabled']).toBe(false);
-    expect(shorthand.children).toBe(null);
-    expect(shorthand.children).toBe(null);
     expect(shorthand.role).toBe('button');
     expect(shorthand.onClick).toBeInstanceOf(Function);
     expect(shorthand.tabIndex).toBeUndefined();
@@ -39,7 +37,6 @@ describe('useARIAButton', () => {
     expect(shorthand.role).toBe('button');
     expect(shorthand.disabled).toBeUndefined();
     expect(shorthand['aria-disabled']).toBe(false);
-    expect(shorthand.children).toBe(null);
     expect(shorthand.tabIndex).toBe(0);
     expect(shorthand.onClick).toBeInstanceOf(Function);
     expect(shorthand.onKeyDown).toBeInstanceOf(Function);

packages/react-aria/src/hooks/useARIAButton.ts

@@ -77,10 +77,6 @@ export function useARIAButton<T extends React.ButtonHTMLAttributes<HTMLElement>>
     }
   });
 
-  if (!shorthand.hasOwnProperty('children')) {
-    shorthand.children = null;
-  }
-
   if (!shorthand.hasOwnProperty('as') || shorthand.as === 'button') {
     shorthand.as = 'button';
     return shorthand; // there's nothing to be done if as prop === 'button'