fix(textfield): allow input props to be passed through

refs #396
agrc · Dec 18, 2024 · df03c1f · df03c1f
1 parent 8115095
commit df03c1f
Showing 1 changed file with 4 additions and 2 deletions.
diff --git a/packages/utah-design-system/src/components/TextField.tsx b/packages/utah-design-system/src/components/TextField.tsx
@@ -2,6 +2,7 @@ import { type ForwardedRef, forwardRef } from 'react';
 import {
   TextField as AriaTextField,
   type TextFieldProps as AriaTextFieldProps,
+  type InputProps,
   type ValidationResult,
 } from 'react-aria-components';
 import { tv } from 'tailwind-variants';
@@ -27,10 +28,11 @@ export interface TextFieldProps extends AriaTextFieldProps {
   label?: string;
   description?: string;
   errorMessage?: string | ((validation: ValidationResult) => string);
+  inputProps?: InputProps;
 }
 
 export const TextField = forwardRef(function TextField(
-  { label, description, errorMessage, ...props }: TextFieldProps,
+  { label, description, errorMessage, inputProps, ...props }: TextFieldProps,
   ref: ForwardedRef<HTMLInputElement>,
 ) {
   return (
@@ -42,7 +44,7 @@ export const TextField = forwardRef(function TextField(
       )}
     >
       {label && <Label>{label}</Label>}
-      <Input ref={ref} className={inputStyles} />
+      <Input ref={ref} {...inputProps} className={inputStyles} />
       {description && <Description>{description}</Description>}
       <FieldError>{errorMessage}</FieldError>
     </AriaTextField>