packageDocumentation module import classnames from "classnames" ; import * as React from "react" ; import { Input as ITwinUI_Input } from "@itwin/itwinui-react" ; import { useRefs } from "../utils/hooks/useRefs" ; import { CommonProps } from "../utils/Props" ; public deprecated export interface InputProps extends React . InputHTMLAttributes < HTMLInputElement > , CommonProps { /** Indicates whether to set focus to the input element */ setFocus ? : boolean ; /** Native keydown event handler */ nativeKeyHandler ? : ( e : KeyboardEvent ) => void ; /** Provides ability to return reference to HTMLInputElement */ ref ? : React . Ref < HTMLInputElement > ; } const ForwardRefInput = React . forwardRef < HTMLInputElement , InputProps > ( function ForwardRefInput ( props , ref ) { const { className , style , setFocus , nativeKeyHandler , ... otherProps } = props ; const inputElementRef = React . useRef < HTMLInputElement > ( ) ; const refs = useRefs ( inputElementRef , ref ) ; React . useEffect ( ( ) => { const currentElement = inputElementRef . current ; const currentHandler = nativeKeyHandler ; if ( currentElement && currentHandler ) { currentElement . addEventListener ( "keydown" , currentHandler ) ; } return ( ) => { if ( currentHandler && currentElement ) { currentElement . removeEventListener ( "keydown" , currentHandler ) ; } } ; } , [ nativeKeyHandler ] ) ; React . useEffect ( ( ) => { if ( inputElementRef . current && setFocus ) inputElementRef . current . focus ( ) ; } , [ setFocus ] ) ; const handleFocus = React . useCallback ( ( event ) => { event . currentTarget . select ( ) ; } , [ ] ) ; return ( < ITwinUI_Input ref = { refs } type = "text" { ... otherProps } onFocus = { handleFocus } className = { classnames ( "uicore-inputs-input" , className ) } style = { style } / > ) ; } ) ; public deprecated export const Input = ForwardRefInput ;