FormFieldFeedback takes optional baseFontSize prop

mongodb · Apr 24, 2024 · 4dff042 · 4dff042
1 parent ee92e61
commit 4dff042
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 2 deletions.
diff --git a/packages/form-field/src/FormField/FormField.tsx b/packages/form-field/src/FormField/FormField.tsx
@@ -56,6 +56,7 @@ export const FormField = forwardRef<HTMLDivElement, FormFieldProps>(
       useFormFieldProps({ label, description, state, id, disabled, ...rest });
 
     const formFieldFeedbackProps = {
+      baseFontSize,
       disabled,
       errorMessage,
       id: feedbackId,

diff --git a/packages/form-field/src/FormFieldFeedback/FormFieldFeedback.tsx b/packages/form-field/src/FormFieldFeedback/FormFieldFeedback.tsx
@@ -23,6 +23,7 @@ import {
 import { FormFieldFeedbackProps } from './FormFieldFeedback.types';
 
 export const FormFieldFeedback = ({
+  baseFontSize: baseFontSizeProp,
   disabled,
   errorMessage,
   hideFeedback = false,
@@ -33,7 +34,7 @@ export const FormFieldFeedback = ({
   ...rest
 }: FormFieldFeedbackProps) => {
   const { theme } = useDarkMode();
-  const baseFontSize = useUpdatedBaseFontSize();
+  const baseFontSize = useUpdatedBaseFontSize(baseFontSizeProp);
   const fontStyles = getFontSizeStyles({ baseFontSize, size });
 
   const isErrorState = state === FormFieldState.Error;

diff --git a/packages/form-field/src/FormFieldFeedback/FormFieldFeedback.types.ts b/packages/form-field/src/FormFieldFeedback/FormFieldFeedback.types.ts
@@ -1,9 +1,14 @@
 import { HTMLElementProps } from '@leafygreen-ui/lib';
-import { Size } from '@leafygreen-ui/tokens';
+import { BaseFontSize, Size } from '@leafygreen-ui/tokens';
 
 import { FormFieldState } from '../FormField/FormField.types';
 
 export interface FormFieldFeedbackProps extends HTMLElementProps<'div'> {
+  /**
+   * Base font size of the component. Only effective when `size == 'default'`
+   */
+  baseFontSize?: BaseFontSize;
+
   /**
    * Defines whether the component is disabled
    */