Feat/add canonical url support

[umsungjun]

Summary by CodeRabbit

• New Features

  • Added canonical URL support via new canonicalUrl prop for improved SEO management.
  • Component now automatically manages <link rel="canonical"> tags in the document head.

• Documentation

  • Updated README with canonical URL usage examples and API reference.

• Tests

  • Added comprehensive test coverage for canonical URL functionality.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
react-head-safe	Ready	Preview, Comment	Mar 2, 2026 7:21am

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

Configuration used: defaults

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 5227a37 and 720a15f.

📒 Files selected for processing (9)

• README.ko.md
• README.md
• examples/basic/src/pages/About.tsx
• examples/basic/src/pages/Contact.tsx
• examples/basic/src/pages/Home.tsx
• package.json
• src/ReactHeadSafe.tsx
• src/test/ReactHeadSafe.test.tsx
• src/types.ts

---

📝 Walkthrough

Walkthrough

This pull request adds support for a new canonicalUrl prop to the ReactHeadSafe component, allowing users to specify canonical URLs for SEO purposes. The implementation includes a helper function to manage canonical link tags in the document head and prevents duplicate tags through tag removal before creation.

Changes

Cohort / File(s)	Summary
Type Definitions & Core Logic src/types.ts, src/ReactHeadSafe.tsx	Added canonicalUrl?: string prop to ReactHeadSafeProps interface and implemented updateLinkTag helper to create/update canonical <link rel="canonical"> tags with duplicate prevention.
Test Coverage src/test/ReactHeadSafe.test.tsx	Added tests covering canonical link tag creation, prop updates, and preventing duplicate tags across re-renders in multi-prop scenarios.
Documentation README.md, README.ko.md	Updated API documentation and usage examples to reflect the new canonicalUrl prop and its role in rendering canonical link tags.
Example Usage examples/basic/src/pages/*	Added canonicalUrl prop to ReactHeadSafe component invocations across Home.tsx, Contact.tsx, and About.tsx example pages.
Metadata package.json	Version bumped from 1.3.0 to 1.4.0.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

• feat: implement og:url and og:type with Vitest test cases and demo update (#8) #9: Extends the same ReactHeadSafe component with prop and head-tag management modifications across core logic, types, and tests.
• feat: add and export ReactHeadSafeProps type definitions #7: Introduces/modifies the ReactHeadSafeProps type definition that is extended in this PR with the new canonicalUrl property.

Poem

🐰 A canonical hop through SEO's domain,
Link tags now managed without a strain,
From Home to About, the URLs align,
Version 1.4 marks the design so fine!
Our pages know their place, divine! ✨

✨ Finishing Touches

• 📝 Generate docstrings (stacked PR)
• 📝 Generate docstrings (commit on current branch)

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch feat/add-canonical-url-support

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[codecov-commenter]

⚠️ Please install the to ensure uploads and comments are reliably processed by Codecov.

Codecov Report

✅ All modified and coverable lines are covered by tests.

📢 Thoughts on this report? Let us know!