From 0cab3cf9cd420f307a1e35cc18f1a904d209a9ce Mon Sep 17 00:00:00 2001
From: Burnt Nerve <seanlbray@gmail.com>
Date: Fri, 26 Apr 2024 14:04:44 -0500
Subject: [PATCH] Added prop for more direct access to input styles

---
 .../components/AbstraxionSignin/index.tsx                  | 4 ++--
 packages/ui/src/input.tsx                                  | 7 ++++++-
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/apps/abstraxion-dashboard/components/AbstraxionSignin/index.tsx b/apps/abstraxion-dashboard/components/AbstraxionSignin/index.tsx
index c960b366..504fe967 100644
--- a/apps/abstraxion-dashboard/components/AbstraxionSignin/index.tsx
+++ b/apps/abstraxion-dashboard/components/AbstraxionSignin/index.tsx
@@ -121,7 +121,7 @@ export const AbstraxionSignin = () => {
             </h2>
           </div>
           <Input
-            className="!ui-text-[16px]"
+            baseInputClassName="!ui-text-[16px]"
             placeholder="Verification Code"
             value={otp}
             onChange={handleOtpChange}
@@ -152,7 +152,7 @@ export const AbstraxionSignin = () => {
             </h2>
           </div>
           <Input
-            className="!ui-text-[16px]"
+            baseInputClassName="!ui-text-[16px]"
             placeholder="Email address"
             value={email}
             onChange={handleEmailChange}
diff --git a/packages/ui/src/input.tsx b/packages/ui/src/input.tsx
index b797444f..7f575020 100644
--- a/packages/ui/src/input.tsx
+++ b/packages/ui/src/input.tsx
@@ -6,10 +6,13 @@ type BaseInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "prefix">;
 export interface ITextFieldProps extends BaseInputProps {
   className?: string;
   error?: string;
+  baseInputClassName?: string;
 }
 export function Input({
   className,
   placeholder,
+  // This should only be used for specific classes that can't override the base input styles.
+  baseInputClassName,
   value,
   error,
   onBlur,
@@ -46,7 +49,9 @@ export function Input({
       </label>
       <input
         {...props}
-        className={`ui-z-10 ui-block ui-h-8 ui-w-full ui-border-b ui-relative ${
+        className={`${
+          baseInputClassName || ""
+        } ui-z-10 ui-block ui-h-8 ui-w-full ui-border-b ui-relative ${
           error ? "ui-border-red-400" : ""
         } ui-bg-transparent ui-font-akkuratLL ui-text-sm ui-text-zinc-100 ui-font-normal ui-leading-tight ui-outline-none`}
         onBlur={handleBlur}