Add new Icon parameters to BitDropMenu (#12105)#12106
Merged
msynk merged 1 commit intobitfoundation:developfrom Feb 18, 2026
Merged
Add new Icon parameters to BitDropMenu (#12105)#12106msynk merged 1 commit intobitfoundation:developfrom
msynk merged 1 commit intobitfoundation:developfrom
Conversation
WalkthroughThe BitDropMenu component is refactored to support external icon libraries through new Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches
🧪 Generate unit tests (beta)
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. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/DropMenu/BitDropMenuDemo.razor (1)
119-119: External stylesheets loaded inline within demo content.The
<link>elements for Font Awesome and Bootstrap Icons are placed directly in the demo body rather than in<head>. While this works and is acceptable for a demo page, it's worth noting that in production usage, users should be guided to load these in the document head. Consider adding a brief note or comment in the demo UI.Also applies to: 143-143
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/DropMenu/BitDropMenuDemo.razor` at line 119, The demo currently injects external stylesheets inline (the <link> tags) in BitDropMenuDemo.razor; update the demo to either move those stylesheet includes into the app shell (e.g., index.html/_Host) for production or, if you want to keep them in the demo page, add a short visible note or an HTML comment next to the existing <link> tags in BitDropMenuDemo.razor explaining "For production, load Font Awesome and Bootstrap Icons in the document <head> (e.g., index.html/_Host) instead of in-page links" so users are guided correctly; reference the inline <link> elements in BitDropMenuDemo.razor when making this change.src/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.razor (1)
36-39: Consider extracting the rotation class from the icon name string for clearer intent.The fallback
"ChevronRight bit-ico-r90"embeds a CSS rotation class within the icon name, which couples styling to the naming convention. WhileBitIconInfo.Fromcorrectly handles this and producesbit-icon bit-icon--ChevronRight bit-ico-r90, the pattern is fragile—changes toGetCssClasses()logic (e.g., sanitizing names) could break it silently.Use
BitIconInfo.Css()for explicit external CSS, or apply the rotation class separately on the<i>element, similar to the pattern in_BitNavChild.razorwhere the class is conditional and separate.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.razor` around lines 36 - 39, The fallback icon name embeds a rotation class ("ChevronRight bit-ico-r90") via BitIconInfo.From in BitDropMenu.razor which couples styling to the name; instead, change to provide only the icon name via ChevronDownIconName (or "ChevronRight") to BitIconInfo.From (used by chevronIcon) and move the rotation class out to the <i> element by adding the rotation CSS (e.g., bit-ico-r90) via Classes?.ChevronDown or a conditional class alongside Styles?.ChevronDown; optionally use BitIconInfo.Css() to supply any external icon CSS rather than embedding it in the name so GetCssClasses() only reflects the logical icon name.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.razor.cs`:
- Around line 35-46: Breaking change: the BitDropMenu and BitMenuButton
parameters changed ChevronDownIcon from string? to BitIconInfo?, causing compile
errors for existing string usages; update usages to either use the new
ChevronDownIconName string parameter for Fluent UI icon names or pass a
BitIconInfo instance to ChevronDownIcon (e.g., BitIconInfo factory) where
external/icon-library icons are needed. Locate the parameters in BitDropMenu
(ChevronDownIcon, ChevronDownIconName) and BitMenuButton and replace any markup
attributes like ChevronDownIcon="SomeName" with ChevronDownIconName="SomeName"
or ChevronDownIcon="@BitIconInfo.YourFactory(...)" as appropriate, then update
related demos/tests to follow the new pattern.
---
Nitpick comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.razor`:
- Around line 36-39: The fallback icon name embeds a rotation class
("ChevronRight bit-ico-r90") via BitIconInfo.From in BitDropMenu.razor which
couples styling to the name; instead, change to provide only the icon name via
ChevronDownIconName (or "ChevronRight") to BitIconInfo.From (used by
chevronIcon) and move the rotation class out to the <i> element by adding the
rotation CSS (e.g., bit-ico-r90) via Classes?.ChevronDown or a conditional class
alongside Styles?.ChevronDown; optionally use BitIconInfo.Css() to supply any
external icon CSS rather than embedding it in the name so GetCssClasses() only
reflects the logical icon name.
In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/DropMenu/BitDropMenuDemo.razor`:
- Line 119: The demo currently injects external stylesheets inline (the <link>
tags) in BitDropMenuDemo.razor; update the demo to either move those stylesheet
includes into the app shell (e.g., index.html/_Host) for production or, if you
want to keep them in the demo page, add a short visible note or an HTML comment
next to the existing <link> tags in BitDropMenuDemo.razor explaining "For
production, load Font Awesome and Bootstrap Icons in the document <head> (e.g.,
index.html/_Host) instead of in-page links" so users are guided correctly;
reference the inline <link> elements in BitDropMenuDemo.razor when making this
change.
Cyrus-Sushiant
approved these changes
Feb 18, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
closes #12105
Summary by CodeRabbit