1 files changed, 22 insertions, 0 deletions
diff --git a/examples/with-content/src/components/HeaderLink.astro b/examples/with-content/src/components/HeaderLink.astro
new file mode 100644
index 000000000..e8e2e103b
--- /dev/null
+++ b/examples/with-content/src/components/HeaderLink.astro
@@ -0,0 +1,22 @@
+---
+export interface Props extends astroHTML.JSX.AnchorHTMLAttributes {}
+
+const { href, class: className, ...props } = Astro.props;
+
+const { pathname } = Astro.url;
+const isActive = href === pathname || href === pathname.replace(/\/$/, '');
+---
+
+<a href={href} class:list={[className, { active: isActive }]} {...props}>
+	<slot />
+</a>
+<style>
+	a {
+		display: inline-block;
+		text-decoration: none;
+	}
+	a.active {
+		font-weight: bolder;
+		text-decoration: underline;
+	}
+</style>