Remove usages of forwardRef
It has been deprecated in React 19, which allows functional components to receive refs just like any other prop.
This commit is contained in:
@@ -5,24 +5,22 @@ SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
|
||||
Please see LICENSE in the repository root for full details.
|
||||
*/
|
||||
|
||||
import { type ComponentPropsWithoutRef, forwardRef } from "react";
|
||||
import { type ComponentProps, type FC } from "react";
|
||||
import { Button } from "@vector-im/compound-web";
|
||||
|
||||
import type { LinkProps } from "react-router-dom";
|
||||
import { useLink } from "./Link";
|
||||
|
||||
type Props = Omit<
|
||||
ComponentPropsWithoutRef<typeof Button<"a">>,
|
||||
"as" | "href"
|
||||
> & { to: LinkProps["to"]; state?: unknown };
|
||||
type Props = Omit<ComponentProps<typeof Button<"a">>, "as" | "href"> & {
|
||||
to: LinkProps["to"];
|
||||
state?: unknown;
|
||||
};
|
||||
|
||||
/**
|
||||
* A version of Compound's button component that acts as a link and integrates
|
||||
* with our router setup.
|
||||
*/
|
||||
export const LinkButton = forwardRef<HTMLAnchorElement, Props>(
|
||||
function LinkButton({ to, state, ...props }, ref) {
|
||||
const [path, onClick] = useLink(to, state);
|
||||
return <Button as="a" ref={ref} {...props} href={path} onClick={onClick} />;
|
||||
},
|
||||
);
|
||||
export const LinkButton: FC<Props> = ({ ref, to, state, ...props }) => {
|
||||
const [path, onClick] = useLink(to, state);
|
||||
return <Button as="a" ref={ref} {...props} href={path} onClick={onClick} />;
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user