From 8e70f5face78c5f0273ee395ba792974a86b8504 Mon Sep 17 00:00:00 2001
From: Matthew Russell <mattrussell36@gmail.com>
Date: Wed, 31 Aug 2022 16:13:17 -0700
Subject: [PATCH] chore: readd classname to formgroup (#1215)

---
 libs/ui-toolkit/src/components/form-group/form-group.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/libs/ui-toolkit/src/components/form-group/form-group.tsx b/libs/ui-toolkit/src/components/form-group/form-group.tsx
index 40bbb04f9..06ff27313 100644
--- a/libs/ui-toolkit/src/components/form-group/form-group.tsx
+++ b/libs/ui-toolkit/src/components/form-group/form-group.tsx
@@ -3,6 +3,7 @@ import type { ReactNode } from 'react';
 
 export interface FormGroupProps {
   children: ReactNode;
+  className?: string;
   label: string; // For accessibility reasons this must always be set for screen readers. If you want it to not show, then add labelClassName="sr-only"
   labelFor: string; // Same as above
   hideLabel?: boolean;
@@ -11,17 +12,19 @@ export interface FormGroupProps {
 
 export const FormGroup = ({
   children,
+  className,
   label,
   labelFor,
   labelAlign = 'left',
   hideLabel = false,
 }: FormGroupProps) => {
+  const wrapperClasses = classNames('relative mb-6', className);
   const labelClasses = classNames('block mb-2 text-sm', {
     'text-right': labelAlign === 'right',
     'sr-only': hideLabel,
   });
   return (
-    <div data-testid="form-group" className="relative mb-6">
+    <div data-testid="form-group" className={wrapperClasses}>
       {label && (
         <label htmlFor={labelFor} className={labelClasses}>
           {label}