Update to use section and to accept aria-label as labelText property

src/components/Expandable.js

@@ -3,18 +3,19 @@ import IconButton from './IconButton';
 import Scrollable from './Scrollable';
 import { ChevronUpIcon, ChevronDownIcon } from '@primer/octicons-react';
 
-function Expandable({ excerpt, children, className, variant }) {
+function Expandable({ excerpt, children, className, variant, labelText }) {
   const [expanded, setExpanded] = useState(false);
 
   return (
-    <div
+    <section
       className={[
         'flex-none py-2 px-4 flex justify-between w-full',
         expanded ? 'expanded items-start' : 'collapsed items-center',
         className,
       ]
         .filter(Boolean)
         .join(' ')}
+      aria-label={labelText}
     >
       {expanded && (
         <div className="absolute bottom-0 -ml-4 h-full w-full overflow-hidden bg-inherit rounded-inherit">
@@ -50,7 +51,7 @@ function Expandable({ excerpt, children, className, variant }) {
       >
         <ChevronUpIcon />
       </IconButton>
-    </div>
+    </section>
   );
 }