[Layout] Update Box to support li and tabIndex (#7806)

### WHY are these changes introduced?

Supports #7458 

### WHAT is this pull request doing?

Update `Box` to support `li` and `tabIndex`

Co-authored-by: Lo Kim <[email protected]>

Author: aveline

.changeset/two-readers-arrive.md

@@ -0,0 +1,6 @@
+---
+'@shopify/polaris': minor
+'polaris.shopify.com': patch
+---
+
+Added support for `li` and `tabIndex` on `Box`

polaris-react/src/components/Box/Box.scss

@@ -1,5 +1,13 @@
 @import '../../styles/common';
 
+.listReset {
+  list-style-type: none;
+  margin-block-start: 0;
+  margin-block-end: 0;
+  outline: none;
+  padding-inline-start: 0;
+}
+
 .Box {
   @include responsive-props('box', 'padding', 'padding');
   @include responsive-props(
@@ -112,11 +120,3 @@
 .visuallyHidden {
   @include visually-hidden;
 }
-
-.listReset {
-  list-style-type: none;
-  margin-block-start: 0;
-  margin-block-end: 0;
-  outline: none;
-  padding-inline-start: 0;
-}

polaris-react/src/components/Box/Box.tsx

@@ -19,7 +19,7 @@ import {
 
 import styles from './Box.scss';
 
-type Element = 'div' | 'span' | 'section' | 'ul';
+type Element = 'div' | 'span' | 'section' | 'ul' | 'li';
 type Overflow = 'hidden' | 'scroll';
 type Position = 'relative' | 'absolute' | 'fixed' | 'sticky';
 
@@ -151,9 +151,11 @@ export interface BoxProps extends React.AriaAttributes {
    */
   paddingInlineEnd?: Spacing;
   /** Aria role */
-  role?: Extract<React.AriaRole, 'status'>;
+  role?: Extract<React.AriaRole, 'status' | 'presentation' | 'menu'>;
   /** Shadow on box */
   shadow?: DepthShadowAlias;
+  /** Set tab order */
+  tabIndex?: Extract<React.AllHTMLAttributes<HTMLElement>['tabIndex'], number>;
   /** Width of container */
   width?: string;
   // These could be moved to new layout component(s) in the future
@@ -210,6 +212,7 @@ export const Box = forwardRef<HTMLElement, BoxProps>(
       paddingInlineEnd,
       role,
       shadow,
+      tabIndex,
       width,
       visuallyHidden,
       position,
@@ -332,6 +335,7 @@ export const Box = forwardRef<HTMLElement, BoxProps>(
         ref,
         style: sanitizeCustomProperties(style),
         role,
+        tabIndex,
         ...restProps,
       },
       children,