Use Ref type to accept both types of ref
This commit is contained in:
parent
84bd188dd7
commit
b8e54750a0
3 changed files with 9 additions and 8 deletions
|
@ -14,6 +14,7 @@ import React, {
|
|||
ComponentProps,
|
||||
MutableRefObject,
|
||||
RefCallback,
|
||||
Ref,
|
||||
} from "react";
|
||||
import classNames from "classnames";
|
||||
import { debounce } from "lodash";
|
||||
|
@ -77,7 +78,7 @@ interface IProps {
|
|||
|
||||
export interface IInputProps extends IProps, InputHTMLAttributes<HTMLInputElement> {
|
||||
// The ref pass through to the input
|
||||
inputRef?: RefObject<HTMLInputElement> | RefCallback<HTMLInputElement>;
|
||||
inputRef?: Ref<HTMLInputElement>;
|
||||
// The element to create. Defaults to "input".
|
||||
element: "input";
|
||||
// The input's value. This is a controlled component, so the value is required.
|
||||
|
@ -86,7 +87,7 @@ export interface IInputProps extends IProps, InputHTMLAttributes<HTMLInputElemen
|
|||
|
||||
interface ISelectProps extends IProps, SelectHTMLAttributes<HTMLSelectElement> {
|
||||
// The ref pass through to the select
|
||||
inputRef?: RefObject<HTMLSelectElement> | RefCallback<HTMLSelectElement>;
|
||||
inputRef?: Ref<HTMLSelectElement>;
|
||||
// To define options for a select, use <Field><option ... /></Field>
|
||||
element: "select";
|
||||
// The select's value. This is a controlled component, so the value is required.
|
||||
|
@ -95,7 +96,7 @@ interface ISelectProps extends IProps, SelectHTMLAttributes<HTMLSelectElement> {
|
|||
|
||||
interface ITextareaProps extends IProps, TextareaHTMLAttributes<HTMLTextAreaElement> {
|
||||
// The ref pass through to the textarea
|
||||
inputRef?: RefObject<HTMLTextAreaElement> | RefCallback<HTMLTextAreaElement>;
|
||||
inputRef?: Ref<HTMLTextAreaElement>;
|
||||
element: "textarea";
|
||||
// The textarea's value. This is a controlled component, so the value is required.
|
||||
value: string;
|
||||
|
@ -103,7 +104,7 @@ interface ITextareaProps extends IProps, TextareaHTMLAttributes<HTMLTextAreaElem
|
|||
|
||||
export interface INativeOnChangeInputProps extends IProps, InputHTMLAttributes<HTMLInputElement> {
|
||||
// The ref pass through to the input
|
||||
inputRef?: RefObject<HTMLInputElement> | RefCallback<HTMLInputElement>;
|
||||
inputRef?: Ref<HTMLInputElement>;
|
||||
element: "input";
|
||||
// The input's value. This is a controlled component, so the value is required.
|
||||
value: string;
|
||||
|
|
|
@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
|
|||
Please see LICENSE files in the repository root for full details.
|
||||
*/
|
||||
|
||||
import React, { RefCallback } from "react";
|
||||
import React, { Ref } from "react";
|
||||
import { randomString } from "matrix-js-sdk/src/randomstring";
|
||||
import classnames from "classnames";
|
||||
|
||||
|
@ -16,7 +16,7 @@ export enum CheckboxStyle {
|
|||
}
|
||||
|
||||
interface IProps extends React.InputHTMLAttributes<HTMLInputElement> {
|
||||
inputRef?: RefCallback<HTMLInputElement>;
|
||||
inputRef?: Ref<HTMLInputElement>;
|
||||
kind?: CheckboxStyle;
|
||||
id?: string;
|
||||
}
|
||||
|
|
|
@ -6,11 +6,11 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
|
|||
Please see LICENSE files in the repository root for full details.
|
||||
*/
|
||||
|
||||
import React, { RefCallback } from "react";
|
||||
import React, { Ref } from "react";
|
||||
import classnames from "classnames";
|
||||
|
||||
interface IProps extends React.InputHTMLAttributes<HTMLInputElement> {
|
||||
inputRef?: RefCallback<HTMLInputElement>;
|
||||
inputRef?: Ref<HTMLInputElement>;
|
||||
outlined?: boolean;
|
||||
// If true (default), the children will be contained within a <label> element
|
||||
// If false, they'll be in a div. Putting interactive components that have labels
|
||||
|
|
Loading…
Reference in a new issue