From ca4a5370c15c5a475b09c60289bec96ae8bde755 Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Fri, 16 Sep 2022 13:34:53 -0500
Subject: [PATCH] OutlineBox: allow passing div props through

---
 app/soapbox/components/outline-box.tsx | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/app/soapbox/components/outline-box.tsx b/app/soapbox/components/outline-box.tsx
index 91ad1c57d..41a13bf49 100644
--- a/app/soapbox/components/outline-box.tsx
+++ b/app/soapbox/components/outline-box.tsx
@@ -1,15 +1,18 @@
 import classNames from 'clsx';
 import React from 'react';
 
-interface IOutlineBox {
+interface IOutlineBox extends React.HTMLAttributes<HTMLDivElement> {
   children: React.ReactNode,
   className?: string,
 }
 
 /** Wraps children in a container with an outline. */
-const OutlineBox: React.FC<IOutlineBox> = ({ children, className }) => {
+const OutlineBox: React.FC<IOutlineBox> = ({ children, className, ...rest }) => {
   return (
-    <div className={classNames('p-4 rounded-lg border border-solid border-gray-300 dark:border-gray-800', className)}>
+    <div
+      className={classNames('p-4 rounded-lg border border-solid border-gray-300 dark:border-gray-800', className)}
+      {...rest}
+    >
       {children}
     </div>
   );