New source found from dndbeyond.com

ddb_main/subApps/builder/components/PortraitName/PortraitName.tsx

@@ -16,11 +16,11 @@ import {
 import { useCharacterEngine } from "~/hooks/useCharacterEngine";
 import { builderActions } from "~/tools/js/CharacterBuilder/actions";
 import { builderSelectors } from "~/tools/js/CharacterBuilder/selectors";
-import { FormInputField } from "~/tools/js/Shared/components/common/FormInputField";
 import { PortraitManager } from "~/tools/js/Shared/containers/panes/DecoratePane";
 import Tooltip from "~/tools/js/commonComponents/Tooltip";
 import { CharacterAvatarPortrait } from "~/tools/js/smartComponents/CharacterAvatar";
 
+import { InputField } from "../InputField";
 import styles from "./styles.module.css";
 
 interface Props extends HTMLAttributes<HTMLDivElement> {
@@ -56,7 +56,7 @@ export const PortraitName: FC<Props> = ({
     setCurrentSuggestedNames(suggestedNames);
   }, [suggestedNames]);
 
-  const handleNameFieldSet = (value: string | null): void => {
+  const handleNameFieldSet = (value: string) => {
     let updatedName = value ?? "";
 
     // If the flag useDefaultCharacterName is true and value is falsy, set the name to the DefaultCharacterName
@@ -137,18 +137,16 @@ export const PortraitName: FC<Props> = ({
           </>
         )}
         <div className={styles.inputContainer}>
-          <FormInputField
+          <InputField
             label="Character Name"
-            onBlur={handleNameFieldSet}
             initialValue={localValue}
-            inputAttributes={
-              {
-                spellCheck: false,
-                autoComplete: "off",
-              } as HTMLAttributes<HTMLInputElement>
-            }
             maxLength={InputLimits.characterNameMaxLength}
-            maxLengthErrorMsg={CharacterNameLimitMsg}
+            errorMessage={CharacterNameLimitMsg}
+            onBlur={(e) => handleNameFieldSet(e.target.value)}
+            inputProps={{
+              spellCheck: false,
+              autoComplete: "off",
+            }}
           />
           <Button
             className={styles.suggestionButton}