PageLink Component

Next.js

A wrapper component specifically designed for Next.js, providing enhanced Link functionality with page navigation and breadcrumbs support.

⚠️

Next.js Only

This component is specifically designed for Next.js applications and relies on Next.js routing features. It is not compatible with standard React applications or other frameworks. For non-Next.js projects, please use standard anchor tags or your framework's routing solution.

Live Preview

Home Components Button

Usage

import { PageLink } from '@featherstudio/react-daisyui-kit';

export default function App() {
  return (
    <>
      <PageLink href="/" label="Home" />
      <PageLink href="/about" label="About" active={false} />
      <PageLink href="/contact" label="Contact" />
    </>
  );
}

Features

Next.js Integration

Seamless integration with Next.js Link component.

Breadcrumb Support

Built-in breadcrumb generation capability.

Active Link Styling

Automatic active link detection and styling.

Flexible Props

Accepts all standard Link component props.

Props

Prop	Type	Default	Description
href	string	-	Link destination
label	string	-	Link text
active	boolean	false	Active state
className	string	-	Custom classes

← Back to Components