Skip to content

feat: add separator selector dropdown to Breadcrumb stories#18

Merged
garrity-miepub merged 1 commit intomainfrom
feature/breadcrumb-update-fix
Jan 28, 2026
Merged

feat: add separator selector dropdown to Breadcrumb stories#18
garrity-miepub merged 1 commit intomainfrom
feature/breadcrumb-update-fix

Conversation

@garrity-miepub
Copy link
Copy Markdown
Contributor

  • Add separatorMap with 6 separator options: chevron, slash, arrow, guillemet, pipe, dot
  • Create separatorName dropdown control to replace ReactNode separator prop
  • Hide original separator prop from controls table (was showing 'Set object' button)
  • Add meta-level render function to convert separatorName to separator ReactNode
  • Update Default, TwoItems, and WithSlashSeparator stories to use separatorName
  • Import ChevronRight from lucide-react for chevron separator option
  • Create BreadcrumbStoryArgs type extending BreadcrumbProps with separatorName

This fixes the 'Objects are not valid as a React child' error that occurred when users clicked 'Set object' on the separator control, which created an empty {} that React couldn't render.

breadcrumb.mov

@garrity-miepub garrity-miepub marked this pull request as ready for review January 28, 2026 02:58
@cloudflare-workers-and-pages
Copy link
Copy Markdown

Deploying ui with  Cloudflare Pages  Cloudflare Pages

Latest commit: 0900a69
Status: ✅  Deploy successful!
Preview URL: https://0d6092be.ui-6d0.pages.dev
Branch Preview URL: https://feature-breadcrumb-update-fi.ui-6d0.pages.dev

View logs

@garrity-miepub garrity-miepub merged commit 93b1486 into main Jan 28, 2026
4 of 7 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant