Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(VerticalNavigation): ability to add dividers #963

Merged

Conversation

connerblanton
Copy link
Contributor

πŸ”— Linked issue

#951

❓ Type of change

  • πŸ“– Documentation (updates to the documentation or readme)
  • 🐞 Bug fix (a non-breaking change that fixes an issue)
  • πŸ‘Œ Enhancement (improving an existing functionality)
  • ✨ New feature (a non-breaking change that adds functionality)
  • 🧹 Chore (updates to the build process or auxiliary tools and libraries)
  • ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

πŸ“š Description

This is a non-breaking change that will allow users to divide links into sections within the VerticalNavigation component. There was currently a workaround that I mentioned here, but I thought this would be a good enhancement to the component.

All we are doing here is allowing the links prop to either be what it currently is, an array of VerticalNavigationLink (VerticalNavigationLink[]), or now an array of arrays of VerticalNavigationLink (VerticalNavigationLink[][]).

We then introduce a linksSections computed property to ensure we are always working with VerticalNavigationLink[][]. In the template, we show a UDivider between every section unless it's the last section.

Resolves #951

πŸ“ Checklist

  • I have linked an issue or discussion.
  • I have updated the documentation accordingly.

Copy link

vercel bot commented Nov 13, 2023

The latest updates on your projects. Learn more about Vercel for Git β†—οΈŽ

Name Status Preview Updated (UTC)
ui βœ… Ready (Inspect) Visit Preview Dec 27, 2023 11:57am

@connerblanton connerblanton changed the title Feat/dividers in vertical navigation feat(VerticalNavigation): ability to add dividers Nov 18, 2023
@benjamincanac
Copy link
Member

I'm wondering if this is really necessary as you could just make multiple VerticalNavigation separated using the Divider component.

@connerblanton
Copy link
Contributor Author

Agree. This is definitely a "nice-to-have" feature. I will say I think it could provide some consistency with how we structure and group items in a Dropdown. But good with me if you just want to close this 😊

@benjamincanac
Copy link
Member

@connerblanton Would you mind fixing the conflicts? Also, wouldn't it be better to use the Divider component instead of defining new styles?

@connerblanton
Copy link
Contributor Author

@benjamincanac conflicts have been resolved. I might be missing something here, but I am using the Divider component. I do have styles for it in the ui.config and that's so that it can be customized through the VerticalNavigation component. Is that what you mean by new styles?

@benjamincanac benjamincanac merged commit ffd20b3 into nuxt:dev Dec 27, 2023
2 checks passed
@benjamincanac
Copy link
Member

Thanks @connerblanton! 😊

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.

How to use Divider component to VerticalNavigation component
3 participants