diff --git a/package.json b/package.json index 53b94ab..7aa0277 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@platformbuilders/fluid-react", - "version": "1.2.11", + "version": "1.2.12", "private": false, "description": "Builders React for Fluid Design System", "keywords": [ diff --git a/src/components/TextInput/index.tsx b/src/components/TextInput/index.tsx index d98c26a..204df2c 100644 --- a/src/components/TextInput/index.tsx +++ b/src/components/TextInput/index.tsx @@ -4,6 +4,7 @@ import { FocusEvent, InputHTMLAttributes, MouseEvent, + ReactNode, forwardRef, useRef, useState, @@ -38,7 +39,7 @@ export type TextInputType = InputHTMLAttributes & maxLength?: number; value: string; autoFocus?: boolean; - iconRight?: IconsType; + iconRight?: IconsType | Exclude; iconLeft?: IconsType; onClickIconRight?: (event: MouseEvent) => void; onClickIconLeft?: (event: MouseEvent) => void; @@ -92,7 +93,10 @@ const TextInput: FC = forwardRef< const hasError = error ? error.length > 0 : false; const hasFocus = isFocused || hasValue; - const RightIconComponent: any = iconRight && Icons[iconRight]; + const RightIconComponent: any = + typeof iconRight === 'string' && iconRight in Icons + ? Icons[iconRight as IconsType] + : null; const LeftIconComponent: any = iconLeft && Icons[iconLeft]; const ErrorIconComponent: any = Icons['ExclamationTriangleIcon']; @@ -216,10 +220,14 @@ const TextInput: FC = forwardRef< $hasError={hasError} onClick={onClickIconRight} > - + {RightIconComponent ? ( + + ) : ( + iconRight + )} )}