Remove support for sx from Details component (#6680)

Author: llastflowers

.changeset/strange-knives-study.md

@@ -0,0 +1,5 @@
+---
+'@primer/react': major
+---
+
+Update Details component to no longer support sx

e2e/components/Details.test.ts

@@ -7,10 +7,6 @@ const stories: Array<{title: string; id: string}> = [
     title: 'Default',
     id: 'components-details--default',
   },
-  {
-    title: 'SX Prop Stress Test',
-    id: 'components-details-dev--sx-prop-stress-test',
-  },
 ]
 
 test.describe('Details', () => {

packages/react/src/Details/Details.dev.stories.tsx

@@ -9,13 +9,7 @@
     }
   ],
   "importPath": "@primer/react",
-  "props": [
-    {
-      "name": "sx",
-      "type": "SystemStyleObject",
-      "deprecated": true
-    }
-  ],
+  "props": [],
   "subcomponents": [
     {
       "name": "Details.Summary",
@@ -30,11 +24,6 @@
         {
           "name": "children",
           "type": "React.ReactNode"
-        },
-        {
-          "name": "sx",
-          "type": "SystemStyleObject",
-          "deprecated": true
         }
       ]
     }

packages/react/src/Details/Details.docs.json

@@ -1,9 +1,7 @@
 import React, {useEffect, useState, type ComponentPropsWithoutRef, type ReactElement} from 'react'
-import type {SxProp} from '../sx'
 import {clsx} from 'clsx'
 import classes from './Details.module.css'
 import {useMergedRefs} from '../internal/hooks/useMergedRefs'
-import {BoxWithFallback} from '../internal/components/BoxWithFallback'
 
 const Root = React.forwardRef<HTMLDetailsElement, DetailsProps>(
   ({className, children, ...rest}, forwardRef): ReactElement => {
@@ -40,11 +38,11 @@ const Root = React.forwardRef<HTMLDetailsElement, DetailsProps>(
     }, [])
 
     return (
-      <BoxWithFallback as="details" className={clsx(className, classes.Details)} {...rest} ref={ref}>
+      <details className={clsx(className, classes.Details)} {...rest} ref={ref}>
         {/* Include default summary if summary is not provided */}
         {!hasSummary && <Details.Summary data-default-summary>{'See Details'}</Details.Summary>}
         {children}
-      </BoxWithFallback>
+      </details>
     )
   },
 )
@@ -75,5 +73,5 @@ const Details = Object.assign(Root, {
   Summary,
 })
 
-export type DetailsProps = ComponentPropsWithoutRef<'details'> & SxProp
+export type DetailsProps = ComponentPropsWithoutRef<'details'>
 export default Details