Use RefCallback type

pull/28452/head
R Midhun Suresh 2024-11-13 18:23:37 +05:30
parent 5c3a518576
commit 27b62d022e
No known key found for this signature in database
4 changed files with 8 additions and 7 deletions

View File

@ -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);

View File

@ -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>;
} }

View File

@ -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;
} }

View File

@ -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