From 4b8533f9bece02664030ab2499ab1584cef98950 Mon Sep 17 00:00:00 2001
From: Gabriel Kaszewski <gabrielkaszewski@gmail.com>
Date: Tue, 31 Mar 2026 02:28:54 +0200
Subject: [PATCH] =?UTF-8?q?fix:=20polish=20TableOfContents=20=E2=80=94=20i?=
 =?UTF-8?q?nitial=20state,=20Tailwind=20indent,=20aria-current?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/table-of-contents.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/components/table-of-contents.tsx b/components/table-of-contents.tsx
index a0e42db..17abcb8 100644
--- a/components/table-of-contents.tsx
+++ b/components/table-of-contents.tsx
@@ -8,7 +8,7 @@ interface TableOfContentsProps {
 }
 
 export default function TableOfContents({ headings }: TableOfContentsProps) {
-  const [activeSlug, setActiveSlug] = useState("");
+  const [activeSlug, setActiveSlug] = useState(() => headings[0]?.slug ?? "");
 
   useEffect(() => {
     if (headings.length === 0) return;
@@ -43,10 +43,11 @@ export default function TableOfContents({ headings }: TableOfContentsProps) {
         {headings.map(({ slug, text, level }) => (
           <li
             key={slug}
-            style={{ paddingLeft: level === 3 ? "0.75rem" : "0" }}
+            className={level === 3 ? "pl-3" : ""}
           >
             <a
               href={`#${slug}`}
+              aria-current={activeSlug === slug ? "true" : undefined}
               className={`text-sm leading-snug transition-colors duration-150 ${
                 activeSlug === slug
                   ? "text-blue-700 font-semibold"