From 4b204d4c0408e4ceedd8c988e4f22732bc2b1acf Mon Sep 17 00:00:00 2001
From: Alexey Taktarov <molefrog@gmail.com>
Date: Mon, 26 Feb 2024 16:24:52 +0100
Subject: [PATCH] Extend types to cover `className` function.

---
 packages/wouter-preact/types/index.d.ts |  6 +++++-
 packages/wouter/test/link.test-d.tsx    | 12 ++++++++++++
 packages/wouter/types/index.d.ts        |  9 ++++++++-
 3 files changed, 25 insertions(+), 2 deletions(-)

diff --git a/packages/wouter-preact/types/index.d.ts b/packages/wouter-preact/types/index.d.ts
index fe65764..2b4d77e 100644
--- a/packages/wouter-preact/types/index.d.ts
+++ b/packages/wouter-preact/types/index.d.ts
@@ -88,11 +88,15 @@ type AsChildProps<ComponentProps, DefaultElementProps> =
   | ({ asChild?: false } & DefaultElementProps)
   | ({ asChild: true } & ComponentProps);
 
+type HTMLLinkAttributes = Omit<JSX.HTMLAttributes, "className"> & {
+  className?: string | undefined | ((isActive: boolean) => string | undefined);
+};
+
 export type LinkProps<H extends BaseLocationHook = BrowserLocationHook> =
   NavigationalProps<H> &
     AsChildProps<
       { children: ComponentChildren; onClick?: JSX.MouseEventHandler<Element> },
-      JSX.HTMLAttributes
+      HTMLLinkAttributes
     >;
 
 export type RedirectProps<H extends BaseLocationHook = BrowserLocationHook> =
diff --git a/packages/wouter/test/link.test-d.tsx b/packages/wouter/test/link.test-d.tsx
index ee3f23d..5143363 100644
--- a/packages/wouter/test/link.test-d.tsx
+++ b/packages/wouter/test/link.test-d.tsx
@@ -39,6 +39,18 @@ describe("<Link /> types", () => {
     </Link>;
   });
 
+  it("can accept function as `className`", () => {
+    <Link
+      href="/"
+      className={(isActive) => (isActive ? "active" : "non-active")}
+    />;
+
+    <Link
+      href="/"
+      className={(isActive) => (isActive ? "active" : undefined)}
+    />;
+  });
+
   it("should support other navigation params", () => {
     <Link href="/" state={{ a: "foo" }}>
       test
diff --git a/packages/wouter/types/index.d.ts b/packages/wouter/types/index.d.ts
index 5ffb9be..4e9fc8e 100644
--- a/packages/wouter/types/index.d.ts
+++ b/packages/wouter/types/index.d.ts
@@ -103,11 +103,18 @@ type AsChildProps<ComponentProps, DefaultElementProps> =
   | ({ asChild?: false } & DefaultElementProps)
   | ({ asChild: true } & ComponentProps);
 
+type HTMLLinkAttributes = Omit<
+  AnchorHTMLAttributes<HTMLAnchorElement>,
+  "className"
+> & {
+  className?: string | undefined | ((isActive: boolean) => string | undefined);
+};
+
 export type LinkProps<H extends BaseLocationHook = BrowserLocationHook> =
   NavigationalProps<H> &
     AsChildProps<
       { children: ReactElement; onClick?: MouseEventHandler },
-      AnchorHTMLAttributes<HTMLAnchorElement> & RefAttributes<HTMLAnchorElement>
+      HTMLLinkAttributes & RefAttributes<HTMLAnchorElement>
     >;
 
 export function Link<H extends BaseLocationHook = BrowserLocationHook>(