Use RefCallback type
This commit is contained in:
parent
5c3a518576
commit
27b62d022e
4 changed files with 8 additions and 7 deletions
|
@ -17,6 +17,7 @@ import React, {
|
||||||
Dispatch,
|
Dispatch,
|
||||||
RefObject,
|
RefObject,
|
||||||
ReactNode,
|
ReactNode,
|
||||||
|
RefCallback,
|
||||||
} from "react";
|
} from "react";
|
||||||
|
|
||||||
import { getKeyBindingsManager } from "../KeyBindingsManager";
|
import { getKeyBindingsManager } from "../KeyBindingsManager";
|
||||||
|
@ -354,7 +355,7 @@ export const RovingTabIndexProvider: React.FC<IProps> = ({
|
||||||
*/
|
*/
|
||||||
export const useRovingTabIndex = <T extends HTMLElement>(
|
export const useRovingTabIndex = <T extends HTMLElement>(
|
||||||
inputRef?: RefObject<T>,
|
inputRef?: RefObject<T>,
|
||||||
): [FocusHandler, boolean, (node: T | null) => void, RefObject<T | null>] => {
|
): [FocusHandler, boolean, RefCallback<T>, RefObject<T | null>] => {
|
||||||
const context = useContext(RovingTabIndexContext);
|
const context = useContext(RovingTabIndexContext);
|
||||||
|
|
||||||
let nodeRef = useRef<T | null>(null);
|
let nodeRef = useRef<T | null>(null);
|
||||||
|
|
|
@ -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.
|
Please see LICENSE files in the repository root for full details.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React, { ReactElement } from "react";
|
import React, { ReactElement, RefCallback } from "react";
|
||||||
|
|
||||||
import { useRovingTabIndex } from "../RovingTabIndex";
|
import { useRovingTabIndex } from "../RovingTabIndex";
|
||||||
import { FocusHandler, Ref } from "./types";
|
import { FocusHandler, Ref } from "./types";
|
||||||
|
@ -16,7 +16,7 @@ interface IProps {
|
||||||
children(renderProps: {
|
children(renderProps: {
|
||||||
onFocus: FocusHandler;
|
onFocus: FocusHandler;
|
||||||
isActive: boolean;
|
isActive: boolean;
|
||||||
ref: (node: HTMLElement | null) => void;
|
ref: RefCallback<HTMLElement>;
|
||||||
}): ReactElement<any, any>;
|
}): ReactElement<any, any>;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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.
|
Please see LICENSE files in the repository root for full details.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from "react";
|
import React, { RefCallback } from "react";
|
||||||
import { randomString } from "matrix-js-sdk/src/randomstring";
|
import { randomString } from "matrix-js-sdk/src/randomstring";
|
||||||
import classnames from "classnames";
|
import classnames from "classnames";
|
||||||
|
|
||||||
|
@ -16,7 +16,7 @@ export enum CheckboxStyle {
|
||||||
}
|
}
|
||||||
|
|
||||||
interface IProps extends React.InputHTMLAttributes<HTMLInputElement> {
|
interface IProps extends React.InputHTMLAttributes<HTMLInputElement> {
|
||||||
inputRef?: (node: HTMLInputElement | null) => void;
|
inputRef?: RefCallback<HTMLInputElement>;
|
||||||
kind?: CheckboxStyle;
|
kind?: CheckboxStyle;
|
||||||
id?: string;
|
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.
|
Please see LICENSE files in the repository root for full details.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from "react";
|
import React, { RefCallback } from "react";
|
||||||
import classnames from "classnames";
|
import classnames from "classnames";
|
||||||
|
|
||||||
interface IProps extends React.InputHTMLAttributes<HTMLInputElement> {
|
interface IProps extends React.InputHTMLAttributes<HTMLInputElement> {
|
||||||
inputRef?: (node: HTMLInputElement | null) => void;
|
inputRef?: RefCallback<HTMLInputElement>;
|
||||||
outlined?: boolean;
|
outlined?: boolean;
|
||||||
// If true (default), the children will be contained within a <label> element
|
// 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
|
// If false, they'll be in a div. Putting interactive components that have labels
|
||||||
|
|
Loading…
Reference in a new issue