versia-pub/docs
2
0
Fork 0
mirror of https://github.com/versia-pub/docs.git synced 2025-12-06 06:18:19 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: 🏷️ Fix several typing issues from React 19

Browse source
This commit is contained in:
Jesse Wierzbinski 2024-12-10 16:31:07 +01:00
parent 7055b89842
commit 8bb062e887
No known key found for this signature in database
3 changed files with 14 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
components/Code.tsx
View file

@ -144,7 +144,8 @@ function CodePanel({
label?: string; label?: string;
code?: string; code?: string;
}) { }) {
const child = Children.only(children); // biome-ignore lint/suspicious/noExplicitAny: <explanation>
const child = Children.only(children) as ReactNode & { props: any };
if (isValidElement(child)) { if (isValidElement(child)) {
tag = child.props.tag ?? tag; tag = child.props.tag ?? tag;
@ -205,7 +206,10 @@ function CodeGroupHeader({
)} )}
> >
{getPanelTitle( {getPanelTitle(
isValidElement(child) ? child.props : {}, isValidElement(child)
? // biome-ignore lint/suspicious/noExplicitAny: <explanation>
(child.props as any)
: {},
)} )}
</Tab> </Tab>
))} ))}
@ -238,7 +242,7 @@ function CodeGroupPanels({
function usePreventLayoutShift() { function usePreventLayoutShift() {
const positionRef = useRef<HTMLElement>(null); const positionRef = useRef<HTMLElement>(null);
const rafRef = useRef<number>(); const rafRef = useRef<number | undefined>(undefined);
useEffect(() => { useEffect(() => {
return () => { return () => {
@ -322,7 +326,8 @@ export function CodeGroup({
}: ComponentPropsWithoutRef<typeof CodeGroupPanels> & { title: string }) { }: ComponentPropsWithoutRef<typeof CodeGroupPanels> & { title: string }) {
const languages = const languages =
Children.map(children, (child) => Children.map(children, (child) =>
getPanelTitle(isValidElement(child) ? child.props : {}), // biome-ignore lint/suspicious/noExplicitAny: <explanation>
getPanelTitle(isValidElement(child) ? (child.props as any) : {}),
) ?? []; ) ?? [];
const tabGroupProps = useTabGroupProps(languages); const tabGroupProps = useTabGroupProps(languages);
const hasTabs = Children.count(children) > 1; const hasTabs = Children.count(children) > 1;

7
components/Heading.tsx
View file

@ -5,6 +5,7 @@ import Link from "next/link";
import { import {
type ComponentPropsWithoutRef, type ComponentPropsWithoutRef,
type ReactNode, type ReactNode,
type RefObject,
useEffect, useEffect,
useRef, useRef,
} from "react"; } from "react";
@ -87,7 +88,7 @@ export function Heading<Level extends 2 | 3>({
}) { }) {
level = level ?? (2 as Level); level = level ?? (2 as Level);
const Component = `h${level}` as "h2" | "h3"; const Component = `h${level}` as "h2" | "h3";
const ref = useRef<HTMLHeadingElement>(null); const ref = useRef<HTMLHeadingElement | null>(null);
const registerHeading = useSectionStore((s) => s.registerHeading); const registerHeading = useSectionStore((s) => s.registerHeading);
const inView = useInView(ref, { const inView = useInView(ref, {
@ -96,10 +97,10 @@ export function Heading<Level extends 2 | 3>({
}); });
useEffect(() => { useEffect(() => {
if (level === 2) { if (level === 2 && ref.current) {
registerHeading({ registerHeading({
id: props.id, id: props.id,
ref, ref: ref as RefObject<HTMLHeadingElement>,
offsetRem: tag || label ? 8 : 6, offsetRem: tag || label ? 8 : 6,
}); });
} }

1
components/Search.tsx
View file

@ -164,6 +164,7 @@ function LoadingIcon(props: ComponentPropsWithoutRef<"svg">) {
function HighlightQuery({ text, query }: { text: string; query: string }) { function HighlightQuery({ text, query }: { text: string; query: string }) {
return ( return (
// @ts-expect-error types not properly updated to react 19
<Highlighter <Highlighter
highlightClassName="underline bg-transparent text-brand-500" highlightClassName="underline bg-transparent text-brand-500"
searchWords={[query]} searchWords={[query]}