mirror of
https://github.com/shlinkio/shlink-web-client.git
synced 2025-01-09 17:57:26 +03:00
Add missing ref to IconInput
This commit is contained in:
parent
2b14c49c80
commit
3be5126e2d
1 changed files with 7 additions and 5 deletions
|
@ -2,25 +2,27 @@ import type { IconProp } from '@fortawesome/fontawesome-svg-core';
|
|||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import classNames from 'classnames';
|
||||
import type { FC } from 'react';
|
||||
import { useRef } from 'react';
|
||||
import type { InputProps } from 'reactstrap';
|
||||
import { Input } from 'reactstrap';
|
||||
import { useElementRef } from './helpers/hooks';
|
||||
import './IconInput.scss';
|
||||
|
||||
type IconInputProps = InputProps & { icon: IconProp };
|
||||
type IconInputProps = InputProps & {
|
||||
icon: IconProp;
|
||||
};
|
||||
|
||||
export const IconInput: FC<IconInputProps> = ({ icon, className, ...rest }) => {
|
||||
const ref = useRef<{ input: HTMLInputElement }>();
|
||||
const ref = useElementRef<HTMLInputElement>();
|
||||
const classes = classNames('icon-input-container__input', className);
|
||||
|
||||
return (
|
||||
<div className="icon-input-container">
|
||||
<Input className={classes} {...rest} />
|
||||
<Input className={classes} innerRef={ref} {...rest} />
|
||||
<FontAwesomeIcon
|
||||
icon={icon}
|
||||
fixedWidth
|
||||
className="icon-input-container__icon"
|
||||
onClick={() => ref.current?.input.focus()}
|
||||
onClick={() => ref.current?.focus()}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
|
Loading…
Reference in a new issue