diff --git a/examples/web/react/components/index.ts b/examples/web/react/components/index.ts
index e97b9f9765c22d58d362408c833564a00955a200..4672a519099ee2ab6a13b7942aecc8a60df3711a 100644
--- a/examples/web/react/components/index.ts
+++ b/examples/web/react/components/index.ts
@@ -3,3 +3,4 @@ export * from "./button-increment/button-increment";
 export * from "./button-switch/button-switch";
 export * from "./info/info";
 export * from "./pair/pair";
+export * from "./section/section";
diff --git a/examples/web/react/components/info/info.tsx b/examples/web/react/components/info/info.tsx
index ce6130a4e0656948c79168392a4c45d60aab9254..a899b91c8e89571c6e58e71819a46ae6ebb20ee0 100644
--- a/examples/web/react/components/info/info.tsx
+++ b/examples/web/react/components/info/info.tsx
@@ -3,7 +3,7 @@ import React, { FC, ReactNode } from "react";
 import "./info.css";
 
 type InfoProps = {
-    children?: ReactNode;
+    children: ReactNode;
     style?: string[];
 };
 
@@ -18,7 +18,7 @@ type InfoProps = {
  * to build the info pairs.
  * @returns The info component with the associated pairs.
  */
-export const Info: FC<InfoProps> = ({ children = [], style = [] }) => {
+export const Info: FC<InfoProps> = ({ children, style = [] }) => {
     const classes = () => ["info", ...style].join(" ");
     return <dl className={classes()}>{children}</dl>;
 };
diff --git a/examples/web/react/components/section/section.css b/examples/web/react/components/section/section.css
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/examples/web/react/components/section/section.tsx b/examples/web/react/components/section/section.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..91a84184a041858745c50f06805b13b4521d6c25
--- /dev/null
+++ b/examples/web/react/components/section/section.tsx
@@ -0,0 +1,25 @@
+import React, { FC, ReactNode } from "react";
+
+import "./section.css";
+
+type SectionProps = {
+    children: ReactNode;
+    separator?: boolean;
+    style?: string[];
+};
+
+export const Section: FC<SectionProps> = ({
+    children,
+    separator = true,
+    style = []
+}) => {
+    const classes = () => ["section", ...style].join(" ");
+    return (
+        <div className={classes()}>
+            {separator && <div className="separator"></div>}
+            <div className="section-contents">{children}</div>
+        </div>
+    );
+};
+
+export default Section;