p-sw/pswui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: fix toc key problem

Browse Source
This commit is contained in:
p-sw 2024-06-02 07:54:16 +09:00
parent 3343957ad7
commit 158603326d
1 changed files with 4 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
packages/react/src/DynamicLayout.tsx
View File

@ -1,4 +1,4 @@
import { ReactNode } from "react"; import { ReactNode, Fragment } from "react";
import { type Toc } from "@stefanprobst/rehype-extract-toc"; import { type Toc } from "@stefanprobst/rehype-extract-toc";
import { useLocation } from "react-router-dom"; import { useLocation } from "react-router-dom";
@ -9,9 +9,10 @@ function RecursivelyToc({ toc }: { toc: Toc }) {
<ul> <ul>
{toc.map((tocEntry) => { {toc.map((tocEntry) => {
return ( return (
<> <Fragment key={tocEntry.id}>
<li <li
key={tocEntry.id} key={tocEntry.id}
data-id={tocEntry.id}
className="text-neutral-500 data-[active='true']:text-black dark:data-[active='true']:text-white text-sm font-medium" className="text-neutral-500 data-[active='true']:text-black dark:data-[active='true']:text-white text-sm font-medium"
style={{ paddingLeft: `${tocEntry.depth - 1}rem` }} style={{ paddingLeft: `${tocEntry.depth - 1}rem` }}
data-active={ data-active={
@ -25,7 +26,7 @@ function RecursivelyToc({ toc }: { toc: Toc }) {
{Array.isArray(tocEntry.children) && ( {Array.isArray(tocEntry.children) && (
<RecursivelyToc toc={tocEntry.children} /> <RecursivelyToc toc={tocEntry.children} />
)} )}
</> </Fragment>
); );
})} })}
</ul> </ul>