Props Are Not Forwarded to Inner Elements

Author: ThomasCode92

src/components/Examples.jsx

@@ -1,4 +1,6 @@
 import { useState } from 'react';
+
+import Section from './Section';
 import TabButton from './TabButton';
 
 import { EXAMPLES } from '../data/examples';
@@ -25,8 +27,7 @@ export default function Examples() {
   }
 
   return (
-    <section id="examples">
-      <h2>Examples</h2>
+    <Section id="examples" title="Examples">
       <menu>
         <TabButton
           isSelected={selectedTopic === 'components'}
@@ -54,6 +55,6 @@ export default function Examples() {
         </TabButton>
       </menu>
       {tabContent}
-    </section>
+    </Section>
   );
 }

src/components/Section.jsx

@@ -0,0 +1,8 @@
+export default function Section({ children, title }) {
+  return (
+    <section>
+      <h2>{title}</h2>
+      {children}
+    </section>
+  );
+}