BlazorUI theme improvements ii (#12320)#12369
Open
msynk wants to merge 62 commits into
Open
Conversation
msynk
requested review from
Cyrus-Sushiant,
Copilot,
mhrastegari,
yasmoradi and
zahra-yousefi
May 22, 2026 07:52
|
Warning Review limit reached
Next review available in: 24 seconds Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: Repository UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (139)
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
WalkthroughThe PR adds shared focus-ring and disabled-color tokens, applies them across BlazorUI components, expands theme runtime APIs with motion/layout and notification support, adds theme-aware media queries and Fluent accessibility styles, and updates demos, documentation, and tests. ChangesTheme styling foundation
Estimated code review effort: 5 (Critical) | ~120 minutes Suggested reviewers: Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ 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 |
Contributor
There was a problem hiding this comment.
Pull request overview
This PR advances the BlazorUI theming system (phase II) by expanding theme tokens (motion/layout/breakpoints), improving accessibility (focus ring tokens + forced-colors), adding runtime system-theme subscription with .NET-side notifications, and updating multiple components/demos to better reflect disabled-state theming.
Changes:
- Add theme change notification pipeline (JS → .NET) and new theme utilities (contrast helpers, density presets, breakpoint defaults, SSR cookie convention, external stylesheet loader).
- Extend theme token surface area (motion + layout + breakpoints) and wire them into CSS variable mapping + Fluent stylesheets (including forced-colors and semantic tokens).
- Update component styling for focus-visible ring consistency and per-role disabled colors; expand demo pages and samples accordingly.
Reviewed changes
Copilot reviewed 111 out of 111 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| src/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorContrastTests.cs | Adds unit tests for WCAG contrast helper. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/ThemingPage.razor | Documents/advertises new advanced theming APIs. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razor.samples.cs | Adds disabled-state samples for BitLink. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razor | Shows disabled-state rendering for BitLink. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razor.cs | Expands color samples (incl. background/foreground/border roles). |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razor | Visual demo updates for additional icon color roles. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cs | Adds disabled-state samples for BitTag. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor | Shows disabled-state rendering for BitTag. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor.cs | Adds disabled-state samples across colors/variants for BitBadge. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor | Shows disabled-state rendering for BitBadge. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.samples.cs | Adds disabled-state samples for BitPagination. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor | Shows disabled-state rendering for BitPagination. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.samples.cs | Adds disabled-state samples for BitTimeline item demo. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor | Shows disabled-state rendering for BitTimeline item demo. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.samples.cs | Adds disabled-state samples for BitTimeline custom demo. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor | Shows disabled-state rendering for BitTimeline custom demo. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cs | Expands SearchBox samples across colors + disabled states. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor | Shows expanded SearchBox color/disabled examples. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cs | Adds disabled-state samples for ChoiceGroup (item). |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor | Shows disabled-state rendering for ChoiceGroup (item). |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.samples.cs | Adds disabled-state samples for ChoiceGroup (custom). |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor | Shows disabled-state rendering for ChoiceGroup (custom). |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cs | Adds disabled-state samples for Checkbox across roles. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor | Shows disabled-state rendering for Checkbox. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razor.samples.cs | Adds disabled-state samples for ToggleButton. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razor | Shows disabled-state rendering for ToggleButton. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/BitButtonGroupDemo.razor.scss | Adds layout helper class for demo arrangement. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.samples.cs | Adds disabled-state samples for ButtonGroup (items). |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razor.samples.cs | Adds disabled-state samples for ButtonGroup (custom). |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.samples.cs | Adds disabled-state samples for Button across roles/variants. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor | Shows disabled-state rendering for Button. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razor.samples.cs | Adds disabled-state samples for ActionButton. |
| src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razor | Shows disabled-state rendering for ActionButton. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeNotifications.cs | Adds .NET theme-change event source. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeMapper.cs | Maps/merges new motion/layout/breakpoint tokens to CSS vars. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cs | Adds notifier registration, override clearing, and async disposal. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsNotifierReceiver.cs | Adds JS-invokable receiver for theme-change notifications. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsExtensions.cs | Adds JS interop calls for clear/register/unregister notifier. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeDensityPresets.cs | Adds compact density preset overlay helper. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeCookie.cs | Documents SSR cookie name convention for theme preference. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorDerivation.cs | Adds optional WCAG-AA text adjustment when deriving colors. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorContrast.cs | Adds WCAG contrast ratio utilities. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeChangedEventArgs.cs | Adds event args for theme-change notifications. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeBreakpointDefaults.cs | Adds default breakpoint constants for theme layout. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeMotion.cs | Adds theme motion token container. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeLayout.cs | Adds theme layout token container (dir/density/breakpoints). |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBreakpoints.cs | Adds breakpoint token container. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitTheme.cs | Extends theme model with Motion and Layout. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeLoader.cs | Adds .NET helper to attach/detach external theme stylesheets. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cs | Adds JS interop calls for external theme link manipulation. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitAccentColorPresets.cs | Adds sample accent color presets for branding. |
| src/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.ts | Adds OS theme subscription + .NET notifications + overrides clearing + external theme loader JS. |
| src/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scss | Adds SCSS vars for disabled/focus tokens and focus-ring shape/shadow tokens. |
| src/BlazorUI/Bit.BlazorUI/Styles/functions.scss | Adds focus ring mixins and imports theme variables. |
| src/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scss | Defines focus-ring CSS variables and focus shadow token. |
| src/BlazorUI/Bit.BlazorUI/Styles/Fluent/semantic-tokens.fluent.scss | Adds semantic token aliases. |
| src/BlazorUI/Bit.BlazorUI/Styles/Fluent/motion.fluent.scss | Adds motion tokens + reduced-motion overrides. |
| src/BlazorUI/Bit.BlazorUI/Styles/Fluent/forced-colors.fluent.scss | Adds forced-colors + prefers-contrast overrides. |
| src/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent.scss | Imports new Fluent token files. |
| src/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-light.scss | Imports new Fluent token files (light). |
| src/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-dark.scss | Imports new Fluent token files (dark). |
| src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss | Switches to importing functions (which imports theme variables) and adds focus utilities. |
| src/BlazorUI/Bit.BlazorUI/Extensions/IBitBlazorUIServiceCollectionExtensions.cs | Registers new theming services in DI. |
| src/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scss | Adds focus ring + role-based disabled colors. |
| src/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scss | Adds role-based disabled colors and fixes border-role mapping. |
| src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scss | Adds role-based disabled colors across variants. |
| src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scss | Adds role-based disabled colors across variants. |
| src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss | Adds focus ring + role-based disabled colors. |
| src/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.scss | Adds role-based disabled colors. |
| src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.scss | Adds role-based disabled colors. |
| src/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.scss | Adds focus ring styling. |
| src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.scss | Adds focus ring styling. |
| src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.scss | Adds role-based disabled colors. |
| src/BlazorUI/Bit.BlazorUI/Components/Inputs/Toggle/BitToggle.scss | Adds focus ring styling. |
| src/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.scss | Refactors focus visuals to shared focus-ring mixins (+ error focus). |
| src/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.scss | Refactors focus visuals to shared focus-ring/underline mixins (+ error focus). |
| src/BlazorUI/Bit.BlazorUI/Components/Inputs/TagsInput/BitTagsInput.scss | Refactors focus visuals to shared focus-ring mixin (+ error focus). |
| src/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scss | Adds consistent thumb focus ring styling. |
| src/BlazorUI/Bit.BlazorUI/Components/Inputs/OtpInput/BitOtpInput.scss | Adds focus-visible ring styling (+ error focus). |
| src/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.scss | Refactors focus visuals to shared focus-ring mixin (+ error focus). |
| src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss | Refactors focus visuals to shared focus-ring mixin (+ error focus). |
| src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scss | Refactors focus visuals to shared focus-ring/underline mixins (+ error focus). |
| src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.scss | Refactors focus visuals to shared focus-ring/underline mixins (+ error focus). |
| src/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.scss | Refactors focus visuals to shared focus-ring/underline mixins (+ error focus). |
| src/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.scss | Refactors underlined focus visuals to shared mixin. |
| src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss | Adds focus ring + role-based disabled colors across variants. |
| src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scss | Refactors focus ring + role-based disabled colors. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 17
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scss (1)
49-56:⚠️ Potential issue | 🟠 Major | ⚡ Quick winFix invalid-state selector mismatch (
.bit-dtrp-icpvs.bit-dtrp-icn).Line 50 targets
.bit-dtrp-icp, but the rest of this component’s icon-container styling uses.bit-dtrp-icn(including Line 54). This can break invalid border-color styling.🔧 Proposed fix
- .bit-dtrp-icp { + .bit-dtrp-icn { border-color: $clr-err; }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scss` around lines 49 - 56, The selector for the invalid state uses the wrong class name: replace the `.bit-dtrp-icp` reference with `.bit-dtrp-icn` so the invalid border-color rule targets the actual icon container used elsewhere; update the rule inside the `&.bit-inv` block (the same block that contains `&.bit-dtrp-foc .bit-dtrp-icn`) so `.bit-dtrp-icn` receives `border-color: $clr-err` consistently with the rest of the DateRangePicker styling.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In
`@src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scss`:
- Around line 29-30: The SCSS inside BitActionButton.scss violates stylelint
rule declaration-empty-line-before because there is no blank line before the
border-radius declaration in the :focus-visible block; open the :focus-visible
block (where `@include` focus-ring(var(--bit-acb-clr-hover)) is used) and insert a
single empty line before the border-radius: $shp-border-radius; declaration so
the sequence has a blank line separating declarations and satisfies the linter.
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scss`:
- Line 10: The CSS custom properties use Sass interpolation syntax (e.g.
--bit-chb-ico-clr: #{var(--bit-chb-clr-txt-sec)};) which trips stylelint;
replace all occurrences of "#{var(...)}" with plain "var(...)" for the checkbox
variables (start with --bit-chb-ico-clr and the group referenced in lines 42-53)
so each assignment reads like --bit-chb-ico-clr: var(--bit-chb-clr-txt-sec); and
similarly for the other custom properties to satisfy
custom-property-no-missing-var-function.
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scss`:
- Around line 21-22: The two invalid comment tokens in BitSlider.scss (the empty
comment "/**/" and the "/*webkit*/" token) break stylelint; replace them with
valid, non-empty comment syntax or remove them entirely—e.g., delete the empty
"/**/" and change "/*webkit*/" to a proper spaced comment like "/* webkit */" or
add the intended vendor-prefixed rule (e.g., "-webkit-..." with a proper
comment), ensuring no empty comments remain so stylelint passes.
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/TagsInput/BitTagsInput.scss`:
- Around line 27-30: The stylelint violation is caused by missing blank lines
before declaration blocks; update the SCSS so there is an empty line before the
declarations in the selectors &.bit-tgi-fcs .bit-tgi-cnt and the other block
around lines 50-51 (the second selector that triggers the same rule), i.e.,
insert a single blank line immediately before the first property/declaration
inside those selector blocks so they satisfy declaration-empty-line-before.
In `@src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss`:
- Line 1: In src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss the import statement
`@import` "functions.scss"; violates scss/load-partial-extension; remove the .scss
extension so the import reads `@import` "functions"; to reference the partial
correctly and satisfy the stylelint rule.
In `@src/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-dark.scss`:
- Around line 13-17: In bit.blazorui.fluent-dark.scss the three `@import` lines
reference partials with the .scss extension ("motion.fluent.scss",
"forced-colors.fluent.scss", "semantic-tokens.fluent.scss"); remove the ".scss"
extension from each import so they become `@import` "motion.fluent", `@import`
"forced-colors.fluent", and `@import` "semantic-tokens.fluent" to satisfy the
scss/load-partial-extension rule and avoid stylelint failures.
In `@src/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-light.scss`:
- Around line 13-17: Imports in bit.blazorui.fluent-light.scss include the .scss
extension which violates scss/load-partial-extension; update the three `@import`
statements referencing "motion.fluent.scss", "forced-colors.fluent.scss", and
"semantic-tokens.fluent.scss" to omit the .scss extension (e.g. `@import`
"motion.fluent"; `@import` "forced-colors.fluent"; `@import`
"semantic-tokens.fluent";) so they load as SCSS partials and satisfy stylelint.
In `@src/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent.scss`:
- Around line 17-21: The three `@import` statements referencing partials include
the .scss extension which violates scss/load-partial-extension; update the
imports in bit.blazorui.fluent.scss by removing the “.scss” suffix from
"motion.fluent.scss", "forced-colors.fluent.scss", and
"semantic-tokens.fluent.scss" so they become `@import` "motion.fluent", `@import`
"forced-colors.fluent", and `@import` "semantic-tokens.fluent" respectively.
In `@src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scss`:
- Around line 214-218: Add the required blank lines before the comment blocks
around the "req" and "focus (a11y)" comments to satisfy the
scss/double-slash-comment-empty-line-before rule: insert an empty line
immediately before the "//req" comment (the section defining --bit-clr-req) and
before the "//focus (a11y) — color of the focus indicator per role." comment so
the comment blocks preceding the --bit-clr-req variable and the focus
explanation are separated by a blank line.
In `@src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scss`:
- Around line 216-220: The two single-line comments before the variable
declaration violate scss/double-slash-comment-empty-line-before; insert one
blank line immediately above each comment marker (//req and //focus) so there is
an empty line before those comments, keeping the existing comment text and the
--bit-clr-req variable declaration unchanged.
In `@src/BlazorUI/Bit.BlazorUI/Styles/Fluent/forced-colors.fluent.scss`:
- Line 24: Add a single blank line above the comment "// Focus must remain
visible in High Contrast — use system Highlight color and a single solid ring."
inside the forced-colors Fluent SCSS block in forced-colors.fluent.scss so it
satisfies the scss/double-slash-comment-empty-line-before rule; locate the
comment text and insert one empty line immediately before it.
In `@src/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scss`:
- Around line 19-24: Add a blank line immediately before the comment block that
begins with "//focus ring (a11y) — width is the visible thickness, offset is the
gap between the element and the ring." so the double-slash comment has an empty
line above it (fixes scss/double-slash-comment-empty-line-before); keep the rest
of the block intact including the variable declarations
(--bit-shp-focus-ring-width, --bit-shp-focus-ring-offset, --bit-shd-focus-ring)
and surrounding comments.
In `@src/BlazorUI/Bit.BlazorUI/Styles/functions.scss`:
- Around line 44-49: The focus-ring mixin currently hardcodes a two-layer
box-shadow which ignores the global forced-colors override; update the mixin
(focus-ring) to use the global focus shadow token (CSS variable
--bit-shd-focus-ring) instead of the literal two-layer value so forced-colors
can override it, providing the existing composed value as a fallback (construct
the var(...) with a fallback that uses the current #{$offset},
#{$clr-bg-pri-focus} and #{$color} composition) and keep outline: none
unchanged.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.ts`:
- Around line 183-185: BitTheme currently registers BitTheme._onSchemeChange
with both addEventListener and the legacy addListener on
BitTheme._schemeMediaQuery which can cause duplicate callbacks; change the
registration to feature-detect and call only one API (use addEventListener if
present, otherwise fall back to addListener) when attaching the handler, and
mirror that logic for removal (use removeEventListener if available, otherwise
removeListener) so BitTheme._schemeMediaQuery and BitTheme._onSchemeChange are
only registered once.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorDerivation.cs`:
- Around line 30-36: The current logic in BitThemeColorDerivation.cs (inside the
block that checks adjustTextForWcagAa and variants.Main/Text) simply toggles
variants.Text to black or white based on whether it equals "`#000000`", which can
still fail WCAG on dark backgrounds; instead compute contrast ratios for both
candidate colors ("`#000000`" and "`#FFFFFF`") against variants.Main using
BitThemeColorContrast.GetContrastRatio and choose the candidate with the higher
ratio (and assign it to variants.Text), optionally verifying the chosen color
satisfies BitThemeColorContrast.MeetsWcagAaNormalText and falling back to the
better of the two if only one meets the threshold.
In
`@src/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorContrastTests.cs`:
- Around line 11-13: Replace the loose threshold assertion for black/white
contrast with a deterministic equality check: call
BitThemeColorContrast.GetContrastRatio("`#000000`", "`#FFFFFF`"), assert the
returned ratio is approximately 21.0 within a small tolerance (e.g., 0.01), and
then use BitThemeColorContrast.MeetsWcagAaNormalText(ratio) to assert
compliance; this makes the test deterministic while still verifying the
MeetsWcagAaNormalText behavior.
---
Outside diff comments:
In
`@src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scss`:
- Around line 49-56: The selector for the invalid state uses the wrong class
name: replace the `.bit-dtrp-icp` reference with `.bit-dtrp-icn` so the invalid
border-color rule targets the actual icon container used elsewhere; update the
rule inside the `&.bit-inv` block (the same block that contains `&.bit-dtrp-foc
.bit-dtrp-icn`) so `.bit-dtrp-icn` receives `border-color: $clr-err`
consistently with the rest of the DateRangePicker styling.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: a88c7bf4-5e35-4d3e-acc1-ec9b20c444db
📒 Files selected for processing (111)
src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/OtpInput/BitOtpInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TagsInput/BitTagsInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Toggle/BitToggle.scsssrc/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scsssrc/BlazorUI/Bit.BlazorUI/Extensions/IBitBlazorUIServiceCollectionExtensions.cssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/forced-colors.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/motion.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/semantic-tokens.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/bit-css.scsssrc/BlazorUI/Bit.BlazorUI/Styles/functions.scsssrc/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scsssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitAccentColorPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeLoader.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitTheme.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBreakpoints.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeLayout.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeMotion.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeBreakpointDefaults.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeChangedEventArgs.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorContrast.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorDerivation.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeCookie.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeDensityPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsNotifierReceiver.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeMapper.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeNotifications.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.tssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/BitButtonGroupDemo.razor.scsssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/ThemingPage.razorsrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorContrastTests.cs
Member
Author
|
@coderabbitai re-review |
|
✅ Actions performedFull review triggered. |
Contributor
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 114 out of 114 changed files in this pull request and generated 3 comments.
Comments suppressed due to low confidence (1)
src/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.ts:219
invokeMethodAsyncis fired without handling failures. In Blazor Server (or after a circuit disconnect), the stored .NET reference can become invalid and this will surface as an unhandled promise rejection in the browser console on theme changes (including OS-driven changes). Consider wrappinginvokeMethodAsyncwith a.catch(() => { ... })(and possibly clearing_dotnetNotifier) to avoid noisy errors and improve resilience.
There was a problem hiding this comment.
Actionable comments posted: 6
🧹 Nitpick comments (2)
src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeLoader.cs (2)
16-18: ⚡ Quick winAdd parameter validation for linkElementId and href.
The method accepts string parameters but doesn't validate them. Adding null/empty checks would provide better error messages and prevent unexpected JS errors. The XML documentation already warns about trusted URLs, so validation here reinforces that guidance.
🛡️ Suggested validation
public ValueTask AttachStylesheetAsync(string linkElementId, string href) { + if (string.IsNullOrWhiteSpace(linkElementId)) + throw new ArgumentException("Link element ID cannot be null or empty.", nameof(linkElementId)); + if (string.IsNullOrWhiteSpace(href)) + throw new ArgumentException("Href cannot be null or empty.", nameof(href)); + return _js.BitExternalThemeAttach(linkElementId, href); }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeLoader.cs` around lines 16 - 18, AttachStylesheetAsync currently forwards linkElementId and href to _js.BitExternalThemeAttach without validation; add input checks at the start of BitExternalThemeLoader.AttachStylesheetAsync to throw ArgumentNullException when linkElementId or href is null and ArgumentException (or ArgumentException with nameof()) when either is empty or whitespace, so callers get clear .NET exceptions instead of JS errors, then return the existing _js.BitExternalThemeAttach(linkElementId, href) as before.
21-23: ⚡ Quick winAdd parameter validation for linkElementId.
🛡️ Suggested validation
public ValueTask DetachStylesheetAsync(string linkElementId) { + if (string.IsNullOrWhiteSpace(linkElementId)) + throw new ArgumentException("Link element ID cannot be null or empty.", nameof(linkElementId)); + return _js.BitExternalThemeDetach(linkElementId); }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeLoader.cs` around lines 21 - 23, DetachStylesheetAsync currently forwards linkElementId to _js.BitExternalThemeDetach without validation; add parameter validation in DetachStylesheetAsync to throw ArgumentNullException or ArgumentException when linkElementId is null, empty, or whitespace before calling _js.BitExternalThemeDetach, so callers receive a clear exception instead of passing invalid input into the JS interop call.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss`:
- Around line 100-102: The .bit-drp-nbd rule currently removes the focus ring in
the &:focus selector which eliminates a visible keyboard focus cue; update the
.bit-drp-nbd &:focus block to provide a clear, accessible focus treatment
instead of box-shadow: none (for example restore a subtle visible outline or a
2px focus ring using theme focus color and sufficient contrast), ensuring the
selector is `.bit-drp-nbd` and the modified state is `&:focus`, and keep the
styling keyboard-only-friendly (non-invasive) and high-contrast for
accessibility.
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scss`:
- Around line 22-36: Replace the hardcoded thumb focus box-shadow used in the
input:focus-visible::-webkit-slider-thumb / input:focus::-webkit-slider-thumb
and input:focus-visible::-moz-range-thumb / input:focus::-moz-range-thumb rules
with the global focus-ring shadow token so forced-colors/global theme overrides
apply; specifically remove the manual box-shadow construction and reference the
CSS custom property (e.g. --bit-shd-focus-ring or the project's focus-ring
token) for the thumb focus shadow, preserving the border-color change to
$clr-pri-focus and keeping existing selectors intact.
In `@src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scss`:
- Line 231: The border-focus token --bit-clr-brd-pri-focus is incorrectly
aliased to the primary role --bit-clr-pri; update the alias so the focus token
references the border role instead by changing --bit-clr-brd-pri-focus to use
var(--bit-clr-brd-pri) (so components using border-role focus get the correct
border color). Ensure you update the declaration of --bit-clr-brd-pri-focus in
colors.fluent-dark.scss accordingly.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.ts`:
- Around line 165-170: The shouldFollowSystem() logic allows an explicitly
persisted theme to be overridden by the presence of the bit-theme-system
attribute; change the checks so a persisted explicit theme blocks
system-following: in BitTheme.shouldFollowSystem() first return false if
BitTheme._persist && BitTheme.getPersisted() !== BitTheme.SYSTEM_THEME (i.e., an
explicit persisted theme exists), then keep the existing checks for
BitTheme._stopFollowingSystem and
document.documentElement.hasAttribute('bit-theme-system'); ensure you still
return true only when persisted value equals BitTheme.SYSTEM_THEME or the
attribute is set and no explicit persisted theme prevents it.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeChangedEventArgs.cs`:
- Around line 8-12: The BitThemeChangedEventArgs constructor currently assigns
possibly-null parameters to non-nullable properties NewTheme and OldTheme; add
input guards in the BitThemeChangedEventArgs constructor to validate newTheme
and oldTheme and throw ArgumentNullException (or ArgumentException) for null
values before assigning to the NewTheme and OldTheme properties so the
non-nullable contract is preserved.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorDerivation.cs`:
- Around line 30-49: The code currently overwrites variants.Text during the WCAG
adjustment even when the caller explicitly provided a non-null text color;
change the logic so adjustments only happen for auto-suggested text (i.e., when
variants.Text was null/unspecified). Concretely, capture the original
variants.Text before the if (adjustTextForWcagAa ...) block (or check at the top
of that block) and only run the contrast calculations/assignments that set
variants.Text when the original variants.Text is null; leave variants.Text
untouched if it was non-null. This touches the adjustTextForWcagAa check and the
assignments to variants.Text (and still uses
BitThemeColorContrast.GetContrastRatio/MeetsWcagAaNormalText with
variants.Main).
---
Nitpick comments:
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeLoader.cs`:
- Around line 16-18: AttachStylesheetAsync currently forwards linkElementId and
href to _js.BitExternalThemeAttach without validation; add input checks at the
start of BitExternalThemeLoader.AttachStylesheetAsync to throw
ArgumentNullException when linkElementId or href is null and ArgumentException
(or ArgumentException with nameof()) when either is empty or whitespace, so
callers get clear .NET exceptions instead of JS errors, then return the existing
_js.BitExternalThemeAttach(linkElementId, href) as before.
- Around line 21-23: DetachStylesheetAsync currently forwards linkElementId to
_js.BitExternalThemeDetach without validation; add parameter validation in
DetachStylesheetAsync to throw ArgumentNullException or ArgumentException when
linkElementId is null, empty, or whitespace before calling
_js.BitExternalThemeDetach, so callers receive a clear exception instead of
passing invalid input into the JS interop call.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: 2ad50f34-04f2-4426-a620-fe354e18d8ee
📒 Files selected for processing (114)
src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/OtpInput/BitOtpInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TagsInput/BitTagsInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Toggle/BitToggle.scsssrc/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scsssrc/BlazorUI/Bit.BlazorUI/Extensions/IBitBlazorUIServiceCollectionExtensions.cssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/forced-colors.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/motion.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/semantic-tokens.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/bit-css.scsssrc/BlazorUI/Bit.BlazorUI/Styles/functions.scsssrc/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scsssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitAccentColorPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeLoader.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitTheme.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBoxShadows.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBreakpoints.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeColors.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeLayout.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeMotion.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeShapes.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeBreakpointDefaults.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeChangedEventArgs.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorContrast.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorDerivation.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeCookie.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeDensityPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsNotifierReceiver.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeMapper.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeNotifications.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.tssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/BitButtonGroupDemo.razor.scsssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/ThemingPage.razorsrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorContrastTests.cs
Member
Author
|
@coderabbitai re-review |
|
✅ Actions performedFull review triggered. |
There was a problem hiding this comment.
Actionable comments posted: 5
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
src/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.ts (1)
59-75:⚠️ Potential issue | 🟠 Major | ⚡ Quick winPersisting resolved light/dark on init breaks system-follow when
persistis enabled.When
systemmode is active with no stored value,initcurrently resolves to a concrete theme (light/dark) and persists it. That makesshouldFollowSystem()immediately stop following OS changes because persisted value is no longer"system".Proposed fix
- if (BitTheme._initOptions.system) { - theme = BitTheme.isSystemDark() ? BitTheme._darkTheme : BitTheme._lightTheme; - } + if (BitTheme._initOptions.system) { + // Persist intent as "system"; set(...) will still apply resolved light/dark to the attribute. + theme = BitTheme.SYSTEM_THEME; + }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.ts` around lines 59 - 75, The init currently resolves a concrete theme when BitTheme._initOptions.system is true and no persisted value exists, then sets BitTheme._persist and writes that resolved theme which makes BitTheme._stopFollowingSystem true; instead, when system mode is enabled and BitTheme.getPersisted() returns null, do not mark _persist true or overwrite persisted state — call BitTheme.set with the resolved theme only for initial display but avoid toggling BitTheme._persist or writing a persisted value (so leave BitTheme._stopFollowingSystem unchanged and keep SYSTEM_THEME as the effective persisted indicator until the user explicitly picks a theme).
🧹 Nitpick comments (1)
src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cs (1)
528-533: ⚡ Quick winMake the disabled primary sample explicit.
Line 528 currently relies on default color resolution. For role-color coverage, set primary explicitly so this sample won’t drift if defaults change.
Proposed tweak
-<BitChoiceGroup IsEnabled="false" Label="Primary (default)" DefaultValue="@("A")" TItem="BitChoiceGroupOption<string>" TValue="string" Horizontal> +<BitChoiceGroup IsEnabled="false" Color="BitColor.Primary" Label="Primary" DefaultValue="@("A")" TItem="BitChoiceGroupOption<string>" TValue="string" Horizontal>🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cs` around lines 528 - 533, The sample BitChoiceGroup is relying on implicit/default color resolution; update the BitChoiceGroup markup (the component named BitChoiceGroup in this sample) to explicitly set the primary color by adding a Color="Primary" attribute (so the disabled primary sample remains explicit) while keeping IsEnabled="false" and DefaultValue="@("A")" and the existing BitChoiceGroupOption children unchanged.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.scss`:
- Around line 363-366: The .bit-srb-cnt rule is removing box-shadow
unconditionally which suppresses the focus-ring; update the CSS so the no-border
variant does not clear box-shadow on focus (or focus-visible) — e.g., remove the
global "box-shadow: none" from .bit-srb-cnt and instead only neutralize
box-shadow for non-focused states, ensuring the existing focus-ring mixin (used
for :focus / :focus-visible) can still apply; locate the .bit-srb-cnt selector
and adjust its declarations to preserve the focus state styling.
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scss`:
- Around line 25-26: Add a blank line immediately before the inline double-slash
comment that begins "Reference the global focus-ring shadow token..." in
BitSlider.scss so it satisfies the Stylelint rule
scss/double-slash-comment-empty-line-before; ensure you keep the same
indentation and do not alter the comment text or surrounding rules/selectors in
the BitSlider.scss file.
In `@src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.scss`:
- Around line 12-13: Replace bare uses of the CSS variable --bit-nbr-clr-dis
with a fallback value so disabled text won't inherit unpredictably; update
occurrences of color: var(--bit-nbr-clr-dis) in BitNavBar.scss to something like
color: var(--bit-nbr-clr-dis, var(--bit-nbr-clr, currentColor)) or a concrete
fallback (e.g., rgba(...) ) so the disabled color resolves even when the color
class is missing, and apply the same change to the other occurrence of
var(--bit-nbr-clr-dis).
In `@src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scss`:
- Line 233: Replace the incorrect alias mapping so the border-focus token uses
the border role token instead of the primary palette: update the declaration of
--bit-clr-brd-pri-focus (currently var(--bit-clr-pri)) to reference the border
role token (e.g., var(--bit-clr-brd)) so border-specific focus styling can be
customized independently of --bit-clr-pri.
In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cs`:
- Around line 187-189: Update the disabled "Primary" sample to explicitly set
the color: for the three BitCheckbox usages (the elements with IsEnabled,
Label="Primary", and variations Indeterminate/Value) add
Color="BitColor.Primary" so the disabled color triplet no longer relies on the
default and matches the other color-role samples; target the BitCheckbox
components and the Color property (use BitColor.Primary).
---
Outside diff comments:
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.ts`:
- Around line 59-75: The init currently resolves a concrete theme when
BitTheme._initOptions.system is true and no persisted value exists, then sets
BitTheme._persist and writes that resolved theme which makes
BitTheme._stopFollowingSystem true; instead, when system mode is enabled and
BitTheme.getPersisted() returns null, do not mark _persist true or overwrite
persisted state — call BitTheme.set with the resolved theme only for initial
display but avoid toggling BitTheme._persist or writing a persisted value (so
leave BitTheme._stopFollowingSystem unchanged and keep SYSTEM_THEME as the
effective persisted indicator until the user explicitly picks a theme).
---
Nitpick comments:
In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cs`:
- Around line 528-533: The sample BitChoiceGroup is relying on implicit/default
color resolution; update the BitChoiceGroup markup (the component named
BitChoiceGroup in this sample) to explicitly set the primary color by adding a
Color="Primary" attribute (so the disabled primary sample remains explicit)
while keeping IsEnabled="false" and DefaultValue="@("A")" and the existing
BitChoiceGroupOption children unchanged.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: adf23b9c-ffbd-4cf6-b580-cf1476b6b7f2
📒 Files selected for processing (114)
src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/OtpInput/BitOtpInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TagsInput/BitTagsInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Toggle/BitToggle.scsssrc/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scsssrc/BlazorUI/Bit.BlazorUI/Extensions/IBitBlazorUIServiceCollectionExtensions.cssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/forced-colors.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/motion.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/semantic-tokens.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/bit-css.scsssrc/BlazorUI/Bit.BlazorUI/Styles/functions.scsssrc/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scsssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitAccentColorPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeLoader.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitTheme.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBoxShadows.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBreakpoints.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeColors.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeLayout.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeMotion.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeShapes.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeBreakpointDefaults.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeChangedEventArgs.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorContrast.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorDerivation.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeCookie.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeDensityPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsNotifierReceiver.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeMapper.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeNotifications.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.tssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/BitButtonGroupDemo.razor.scsssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/ThemingPage.razorsrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorContrastTests.cs
|
✅ Action performedFull review finished. |
There was a problem hiding this comment.
Actionable comments posted: 2
♻️ Duplicate comments (5)
src/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scss (1)
22-23: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick winInsert a blank line before the standalone comment.
The
scss/double-slash-comment-empty-line-beforerule requires an empty line before the comment block starting at line 23 to prevent stylelint failures.🐛 Proposed fix
--bit-shp-focus-ring-offset: 0.125rem; //2px + //global focus shadow used by the focus-ring mixin and the .bit-css-shd-focus utility.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scss` around lines 22 - 23, Insert a blank line between the --bit-shp-focus-ring-offset declaration and the standalone comment describing the global focus shadow, preserving the existing declaration and comment text.src/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scss (1)
1-1: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick winRemove the
.scssextension from the partial import to satisfy stylelint.Line 1 currently triggers
scss/load-partial-extension; use extensionless import.💡 Suggested fix
-@import "../../../Styles/functions.scss"; +@import "../../../Styles/functions";🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scss` at line 1, Update the import in BitGrid.scss to reference the functions partial without its .scss extension, preserving the existing relative path.Source: Linters/SAST tools
src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cs (1)
426-428: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick winKeep background-token snippets aligned with their live demos.
The embedded disabled
*Backgroundsamples still omit the contrasting wrapper used by the rendered examples, so copied code does not reproduce the demonstrated presentation. Please wrap them in the dark container.🛠️ Suggested patch
+<div style=""background:var(--bit-clr-fg-sec);color:var(--bit-clr-bg-sec);padding:1rem""> <BitTag IsEnabled=""false"" Text=""PrimaryBackground"" IconName=""`@BitIconName.Calendar`"" Color=""BitColor.PrimaryBackground"" /> <BitTag IsEnabled=""false"" Text=""SecondaryBackground"" IconName=""`@BitIconName.Calendar`"" Color=""BitColor.SecondaryBackground"" /> <BitTag IsEnabled=""false"" Text=""TertiaryBackground"" IconName=""`@BitIconName.Calendar`"" Color=""BitColor.TertiaryBackground"" /> +</div>🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cs` around lines 426 - 428, Update the disabled PrimaryBackground, SecondaryBackground, and TertiaryBackground BitTag snippets in the tag demo to include the same dark wrapper used by their live rendered examples, ensuring copied samples reproduce the demonstrated presentation.src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scss (1)
42-59: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick winDisabled-state CSS custom properties lack SCSS fallbacks across four components. Each component consumes
var(--*-clr-dis)/var(--*-clr-dis-text)directly; these tokens are only defined inside per-color-variant blocks (.bit-*-pri,.bit-*-sec, …), so a disabled instance rendered without one of those variant classes resolves the color to nothing rather than a sensible default. This is the same still-open pattern already raised forBitCheckbox.scss/BitChoiceGroup.scss(and previously forBitBadge.scss/BitTag.scss, not in this batch) plus a newly-found instance inBitSearchBox.scss.
src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scss#L42-L59: add SCSS fallbacks (e.g.#{$clr-fg-dis}/#{$clr-bg-dis}) tovar(--bit-chb-clr-dis-text)andvar(--bit-chb-clr-dis).src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scss#L57-L113: add the same fallbacks tovar(--bit-tgb-clr-dis-text)/var(--bit-tgb-clr-dis)in the fil/otl/txt disabled blocks.src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scss#L319-L353: add the same fallbacks tovar(--bit-chg-clr-dis-text)/var(--bit-chg-clr-dis)in.bit-chg-ids.src/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.scss#L14-L52: add the same fallbacks tovar(--bit-srb-clr-dis-text)/var(--bit-srb-clr-dis)throughout.bit-dis.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scss` around lines 42 - 59, The disabled-state custom properties need SCSS fallbacks when no color-variant class defines them. In BitCheckbox.scss (42-59), BitToggleButton.scss (57-113), BitChoiceGroup.scss (319-353), and BitSearchBox.scss (14-52), update the disabled selectors to use the corresponding $clr-fg-dis and $clr-bg-dis fallbacks for every --*-clr-dis-text and --*-clr-dis var() reference.src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scss (1)
57-61: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick winDisabled color vars still lack fallbacks.
var(--bit-tgb-clr-dis-text)/var(--bit-tgb-clr-dis)have no fallback in the fil/otl/txt disabled blocks. These tokens are only ever set inside per-color-variant blocks (.bit-tgb-pri,.bit-tgb-sec, …), so a toggle rendered without one of those classes resolves to an empty/inherited color when disabled. This mirrors the same still-open pattern in sibling components (see consolidated comment).Also applies to: 83-87, 108-113
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scss` around lines 57 - 61, Update the disabled styles in the fil, otl, and txt blocks of BitToggleButton so each var(--bit-tgb-clr-dis-text) and var(--bit-tgb-clr-dis) usage has an appropriate fallback for toggles without a color-variant class. Preserve the existing per-variant token values when those variables are defined.
🧹 Nitpick comments (3)
src/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeTestGraph.cs (1)
44-56: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value
Activator.CreateInstancewon't returnnullhere — the custom error message is unreachable.For a reference type without a public parameterless constructor,
Activator.CreateInstance(Type)throwsMissingMethodExceptiondirectly rather than returningnull(it only returnsnullforNullable<T>with no value, whichIsModelBranchalready excludes via the value-type check). So theif (child is null)branch with its helpful diagnostic message can never actually run for the scenario it's written for — an unhandledMissingMethodExceptionpropagates instead.Not test-breaking (the test still fails, just with a less specific message), but worth tightening for accurate diagnostics.
♻️ Suggested fix
- var child = prop.GetValue(obj); - if (child is null) - { - child = Activator.CreateInstance(pt); - if (child is null) - { - throw new InvalidOperationException( - $"Theme branch type '{pt.FullName}' (property '{prop.DeclaringType?.Name}.{prop.Name}') " + - "could not be instantiated via its parameterless constructor. " + - "Ensure every theme branch model exposes a public parameterless constructor."); - } - prop.SetValue(obj, child); - } + var child = prop.GetValue(obj); + if (child is null) + { + try + { + child = Activator.CreateInstance(pt) + ?? throw new InvalidOperationException( + $"Theme branch type '{pt.FullName}' (property '{prop.DeclaringType?.Name}.{prop.Name}') " + + "resolved to null via Activator.CreateInstance."); + } + catch (MissingMethodException ex) + { + throw new InvalidOperationException( + $"Theme branch type '{pt.FullName}' (property '{prop.DeclaringType?.Name}.{prop.Name}') " + + "could not be instantiated via its parameterless constructor. " + + "Ensure every theme branch model exposes a public parameterless constructor.", ex); + } + prop.SetValue(obj, child); + }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeTestGraph.cs` around lines 44 - 56, Remove the unreachable inner `if (child is null)` check after `Activator.CreateInstance(pt)` in the theme graph traversal. Let constructor failures propagate or handle `MissingMethodException` at the `Activator.CreateInstance` call if the existing diagnostic is required, while preserving the `prop.SetValue` behavior for successfully created branches.src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeProvider.cs (1)
180-192: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winPrefer
AddMultipleAttributesfor the attribute splat.Calling
AddAttributein a loop with a constant sequence number (2) for a variable-length dictionary is the discouraged splat pattern: Blazor's diffing relies on stable sequence numbers, so attributes added/removed across renders can mis-diff. Build a filtered dictionary (excluding the extractedstyle) and emit it viaAddMultipleAttributes, which is designed for dynamic attribute sets.♻️ Suggested approach
string? userStyle = null; if (AdditionalAttributes is not null) { var splat = new Dictionary<string, object>(AdditionalAttributes.Count, StringComparer.OrdinalIgnoreCase); foreach (var kv in AdditionalAttributes) { if (string.Equals(kv.Key, "style", StringComparison.OrdinalIgnoreCase)) { userStyle = kv.Value?.ToString(); continue; } splat[kv.Key] = kv.Value; } builder.AddMultipleAttributes(2, splat); }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeProvider.cs` around lines 180 - 192, Update the AdditionalAttributes handling in the theme rendering method to collect all non-style attributes into a filtered dictionary, while continuing to extract the style value into userStyle. Replace the constant-sequence AddAttribute loop with a single AddMultipleAttributes call using the filtered dictionary, preserving case-insensitive style exclusion and existing attribute values.src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss (1)
184-185: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick winDropdown focus ring isn't variant-aware.
Unlike
BitToggleButton/BitTextField/BitSearchBoxin this same PR (which added a dedicated--*-clr-focustoken per color variant),BitDropdown's color-variant blocks (.bit-drp-pri….bit-drp-tbr, L808-908) only expose--bit-drp-clr/-hover/-text. Thisfocus-ringcall still falls back to the unparameterized default (primary), so a.bit-drp-err/.bit-drp-suc/etc. dropdown still shows a primary-colored focus ring instead of matching its own theme. Consider defining--bit-drp-clr-focusper variant.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss` around lines 184 - 185, Make the BitDropdown focus ring variant-aware by defining --bit-drp-clr-focus in each color-variant block from .bit-drp-pri through .bit-drp-tbr, using the corresponding variant focus color token. Ensure the existing focus-ring mixin consumes this variable so error, success, and other themed dropdowns no longer fall back to the primary focus color.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In
`@src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scss`:
- Around line 14-19: Update the focus selector in the ButtonGroup styles to use
:has(:focus-visible) instead of :focus-within, while retaining the existing
direct &:focus-visible selector and focus-ring styling so the ring appears only
for keyboard-visible focus.
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scss`:
- Around line 17-39: Add a forced-colors-active media rule in the slider
focus-thumb styles for both `::-webkit-slider-thumb` and `::-moz-range-thumb`,
applying a visible outline fallback so focus remains indicated when box-shadow
is suppressed. Keep the existing themed box-shadow behavior unchanged outside
forced-colors mode.
---
Duplicate comments:
In
`@src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scss`:
- Around line 57-61: Update the disabled styles in the fil, otl, and txt blocks
of BitToggleButton so each var(--bit-tgb-clr-dis-text) and
var(--bit-tgb-clr-dis) usage has an appropriate fallback for toggles without a
color-variant class. Preserve the existing per-variant token values when those
variables are defined.
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scss`:
- Around line 42-59: The disabled-state custom properties need SCSS fallbacks
when no color-variant class defines them. In BitCheckbox.scss (42-59),
BitToggleButton.scss (57-113), BitChoiceGroup.scss (319-353), and
BitSearchBox.scss (14-52), update the disabled selectors to use the
corresponding $clr-fg-dis and $clr-bg-dis fallbacks for every --*-clr-dis-text
and --*-clr-dis var() reference.
In `@src/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scss`:
- Line 1: Update the import in BitGrid.scss to reference the functions partial
without its .scss extension, preserving the existing relative path.
In `@src/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scss`:
- Around line 22-23: Insert a blank line between the --bit-shp-focus-ring-offset
declaration and the standalone comment describing the global focus shadow,
preserving the existing declaration and comment text.
In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cs`:
- Around line 426-428: Update the disabled PrimaryBackground,
SecondaryBackground, and TertiaryBackground BitTag snippets in the tag demo to
include the same dark wrapper used by their live rendered examples, ensuring
copied samples reproduce the demonstrated presentation.
---
Nitpick comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss`:
- Around line 184-185: Make the BitDropdown focus ring variant-aware by defining
--bit-drp-clr-focus in each color-variant block from .bit-drp-pri through
.bit-drp-tbr, using the corresponding variant focus color token. Ensure the
existing focus-ring mixin consumes this variable so error, success, and other
themed dropdowns no longer fall back to the primary focus color.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeProvider.cs`:
- Around line 180-192: Update the AdditionalAttributes handling in the theme
rendering method to collect all non-style attributes into a filtered dictionary,
while continuing to extract the style value into userStyle. Replace the
constant-sequence AddAttribute loop with a single AddMultipleAttributes call
using the filtered dictionary, preserving case-insensitive style exclusion and
existing attribute values.
In `@src/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeTestGraph.cs`:
- Around line 44-56: Remove the unreachable inner `if (child is null)` check
after `Activator.CreateInstance(pt)` in the theme graph traversal. Let
constructor failures propagate or handle `MissingMethodException` at the
`Activator.CreateInstance` call if the existing diagnostic is required, while
preserving the `prop.SetValue` behavior for successfully created branches.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: 546ff81f-46b4-4040-8d24-50a80679644c
📒 Files selected for processing (139)
src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/OtpInput/BitOtpInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TagsInput/BitTagsInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Toggle/BitToggle.scsssrc/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scsssrc/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.razor.cssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.tssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQueryJsRuntimeExtensions.cssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitScreenQuery.cssrc/BlazorUI/Bit.BlazorUI/Extensions/IBitBlazorUIServiceCollectionExtensions.cssrc/BlazorUI/Bit.BlazorUI/Extensions/JsInterop/IJSRuntimeExtensions.cssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/forced-colors.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/motion.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/semantic-tokens.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/bit-css.scsssrc/BlazorUI/Bit.BlazorUI/Styles/functions.scsssrc/BlazorUI/Bit.BlazorUI/Styles/media-queries.scsssrc/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scsssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitAccentColorPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeLoader.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme.tssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitTheme.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBoxShadows.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBreakpoints.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeColors.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeLayout.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeMotion.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeShapes.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeTypography.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeAttributeNames.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeBreakpointDefaults.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeChangedEventArgs.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorContrast.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorDerivation.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeCookie.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeDensityPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsNotifierReceiver.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeMapper.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeName.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeNotifications.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeProvider.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSerialization.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSsr.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeUtilities.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.tssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/BitButtonGroupDemo.razor.scsssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/ThemingPage.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Scripts/app.tssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorContrastTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorDerivationTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeManagerTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeMapperContractTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeMapperMergeDriftTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeModelCoverageTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeProviderHtmlAttributesTest.razorsrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeProviderTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeSsrTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeTestGraph.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/ThemeProbeConsumer.cs
💤 Files with no reviewable changes (1)
- src/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.ts
There was a problem hiding this comment.
Actionable comments posted: 3
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss (2)
1-1: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick winRemove
.scssextension from partial import.This import includes the
.scssextension, which violates thescss/load-partial-extensionrule and will fail stylelint checks.Suggested fix
-@import "theme-variables.scss"; +@import "theme-variables";🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss` at line 1, Update the theme-variables import in bit-css.scss to omit the .scss extension, preserving the existing partial reference while satisfying the scss/load-partial-extension rule.
1-1: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick winRemove
.scssextension from partial import.This import includes the
.scssextension, which violates thescss/load-partial-extensionrule and will fail stylelint checks.Suggested fix
-@import "theme-variables.scss"; +@import "theme-variables";🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss` at line 1, Update the theme-variables import in bit-css.scss to omit the .scss extension, preserving the existing partial reference while satisfying the scss/load-partial-extension lint rule.
♻️ Duplicate comments (4)
src/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scss (2)
22-23: 📐 Maintainability & Code Quality | 🟡 Minor | 💤 Low valueMissing blank line before comment block (stylelint).
Line 22 (
--bit-shp-focus-ring-offset: ...) is immediately followed by the standalone comment at line 23 with no blank line, which will tripscss/double-slash-comment-empty-line-before.Suggested fix
--bit-shp-focus-ring-width: 0.125rem; //2px --bit-shp-focus-ring-offset: 0.125rem; //2px + //global focus shadow used by the focus-ring mixin and the .bit-css-shd-focus utility.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scss` around lines 22 - 23, Insert a blank line after the --bit-shp-focus-ring-offset declaration and before the standalone focus-shadow comment block, preserving the existing declaration and comment text.
22-23: 📐 Maintainability & Code Quality | 🟡 Minor | 💤 Low valueMissing blank line before comment block (stylelint).
Line 22 (
--bit-shp-focus-ring-offset: ...) is immediately followed by the standalone comment at line 23 with no blank line, which will tripscss/double-slash-comment-empty-line-before.Suggested fix
--bit-shp-focus-ring-width: 0.125rem; //2px --bit-shp-focus-ring-offset: 0.125rem; //2px + //global focus shadow used by the focus-ring mixin and the .bit-css-shd-focus utility.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scss` around lines 22 - 23, Insert a blank line between the --bit-shp-focus-ring-offset declaration and the following standalone focus-shadow comment to satisfy the SCSS comment spacing rule.src/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scss (1)
22-39: 🎯 Functional Correctness | 🟠 Major | ⚡ Quick winRestore the forced-colors outline fallback for the focused slider thumb.
The previous review comment was only partially addressed. While the
box-shadowcorrectly utilizesvar(--bit-shd-focus-ring), thebox-shadowproperty is aggressively stripped by the browser in Windows High Contrast / forced-colors mode.Because the
input:focusoutline is suppressed (line 18), keyboard users in High Contrast mode will have no visible focus indicator on the thumb at all. The comment in the code erroneously assumesbox-shadowcustom properties can propagate to forced-colors.Add an
@media (forced-colors: active)outline fallback to both::-webkit-slider-thumband::-moz-range-thumbfocus states, mirroring the behavior natively provided by thefocus-ringmixin.💡 Proposed fix
input:focus-visible::-webkit-slider-thumb, input:focus::-webkit-slider-thumb { border-color: $clr-pri-focus; // Reference the global focus-ring shadow token so forced-colors and theme-level // overrides (see forced-colors.fluent.scss) propagate to the slider thumb. box-shadow: var(--bit-shd-focus-ring, 0 0 0 #{$shp-focus-ring-offset} #{$clr-bg-pri-focus}, 0 0 0 calc(#{$shp-focus-ring-offset} + #{$shp-focus-ring-width}) #{$clr-pri-focus}); + + `@media` (forced-colors: active) { + outline: #{$shp-focus-ring-width} solid Highlight; + outline-offset: #{$shp-focus-ring-offset}; + } } input:focus-visible::-moz-range-thumb, input:focus::-moz-range-thumb { border-color: $clr-pri-focus; box-shadow: var(--bit-shd-focus-ring, 0 0 0 #{$shp-focus-ring-offset} #{$clr-bg-pri-focus}, 0 0 0 calc(#{$shp-focus-ring-offset} + #{$shp-focus-ring-width}) #{$clr-pri-focus}); + + `@media` (forced-colors: active) { + outline: #{$shp-focus-ring-width} solid Highlight; + outline-offset: #{$shp-focus-ring-offset}; + } }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scss` around lines 22 - 39, In the focused thumb selectors for both ::-webkit-slider-thumb and ::-moz-range-thumb, add an `@media` (forced-colors: active) fallback that applies a visible outline, matching the behavior of the existing focus-ring mixin. Keep the current box-shadow declarations and ensure the fallback covers both focus states while compensating for the suppressed input outline.src/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.ts (1)
72-118: 🎯 Functional Correctness | 🟠 Major | ⚡ Quick win
Xsbreakpoint token is documented as effective but is never wired into the resolved media query. Root cause:BitMediaQuery.ts's breakpoint resolution never reads/uses anxsvalue, contradictingBitThemeBreakpoints.Xs's XML remarks. This was flagged in an earlier review round and remains unresolved in the current code.
src/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.ts#L72-L118: add'xs'toBreakpointKeyand_defaultBreakpoints, read--bit-bp-xsinresolveBreakpoints, and change the'Xs'case inbuildScreenQueryto`${min(bp.xs)} and ${max(bp.sm)}`(matching theSm/Md/… pattern).src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBreakpoints.cs#L7-L17: once the TS side is fixed, no doc change is needed; otherwise, clarify thatXsis currently a no-op.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.ts` around lines 72 - 118, Add xs to the BreakpointKey type and _defaultBreakpoints, read --bit-bp-xs in resolveBreakpoints, and update buildScreenQuery’s Xs case to require min(bp.xs) through max(bp.sm). In src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBreakpoints.cs lines 7-17, make no change because the existing documentation becomes accurate after the TypeScript fix.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scss`:
- Around line 16-19: Update the focus selector in the BitMenuButton SCSS block
to avoid using :focus-within for the focus ring, which currently triggers on
mouse-focused child items. Apply the shared BitButtonGroup.scss fix pattern so
the ring responds only to keyboard-visible focus while preserving the existing
focus-ring mixin and color.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cs`:
- Around line 5-13: Update BitExternalThemeAttach and BitExternalThemeDetach to
call the standard IJSRuntime InvokeVoidAsync extension instead of InvokeVoid,
preserving their existing JavaScript identifiers and arguments.
In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razor.samples.cs`:
- Around line 304-306: Wrap the disabled PrimaryBackground, SecondaryBackground,
and TertiaryBackground BitActionButton samples in
BitActionButtonDemo.razor.samples.cs with the specified foreground-tertiary
contrast div. Also wrap the affected BitButton samples in
BitButtonDemo.razor.samples.cs with the specified foreground-secondary contrast
div, matching each corresponding live demo.
---
Outside diff comments:
In `@src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss`:
- Line 1: Update the theme-variables import in bit-css.scss to omit the .scss
extension, preserving the existing partial reference while satisfying the
scss/load-partial-extension rule.
- Line 1: Update the theme-variables import in bit-css.scss to omit the .scss
extension, preserving the existing partial reference while satisfying the
scss/load-partial-extension lint rule.
---
Duplicate comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scss`:
- Around line 22-39: In the focused thumb selectors for both
::-webkit-slider-thumb and ::-moz-range-thumb, add an `@media` (forced-colors:
active) fallback that applies a visible outline, matching the behavior of the
existing focus-ring mixin. Keep the current box-shadow declarations and ensure
the fallback covers both focus states while compensating for the suppressed
input outline.
In `@src/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.ts`:
- Around line 72-118: Add xs to the BreakpointKey type and _defaultBreakpoints,
read --bit-bp-xs in resolveBreakpoints, and update buildScreenQuery’s Xs case to
require min(bp.xs) through max(bp.sm). In
src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBreakpoints.cs lines
7-17, make no change because the existing documentation becomes accurate after
the TypeScript fix.
In `@src/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scss`:
- Around line 22-23: Insert a blank line after the --bit-shp-focus-ring-offset
declaration and before the standalone focus-shadow comment block, preserving the
existing declaration and comment text.
- Around line 22-23: Insert a blank line between the --bit-shp-focus-ring-offset
declaration and the following standalone focus-shadow comment to satisfy the
SCSS comment spacing rule.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: 546ff81f-46b4-4040-8d24-50a80679644c
📒 Files selected for processing (139)
src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/OtpInput/BitOtpInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TagsInput/BitTagsInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Toggle/BitToggle.scsssrc/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scsssrc/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.razor.cssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.tssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQueryJsRuntimeExtensions.cssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitScreenQuery.cssrc/BlazorUI/Bit.BlazorUI/Extensions/IBitBlazorUIServiceCollectionExtensions.cssrc/BlazorUI/Bit.BlazorUI/Extensions/JsInterop/IJSRuntimeExtensions.cssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/forced-colors.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/motion.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/semantic-tokens.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/bit-css.scsssrc/BlazorUI/Bit.BlazorUI/Styles/functions.scsssrc/BlazorUI/Bit.BlazorUI/Styles/media-queries.scsssrc/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scsssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitAccentColorPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeLoader.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme.tssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitTheme.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBoxShadows.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBreakpoints.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeColors.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeLayout.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeMotion.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeShapes.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeTypography.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeAttributeNames.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeBreakpointDefaults.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeChangedEventArgs.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorContrast.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorDerivation.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeCookie.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeDensityPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsNotifierReceiver.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeMapper.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeName.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeNotifications.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeProvider.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSerialization.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSsr.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeUtilities.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.tssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/BitButtonGroupDemo.razor.scsssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/ThemingPage.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Scripts/app.tssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorContrastTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorDerivationTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeManagerTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeMapperContractTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeMapperMergeDriftTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeModelCoverageTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeProviderHtmlAttributesTest.razorsrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeProviderTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeSsrTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeTestGraph.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/ThemeProbeConsumer.cs
💤 Files with no reviewable changes (1)
- src/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.ts
Member
Author
|
@coderabbitai full-review |
|
✅ Action performedFull review finished. |
There was a problem hiding this comment.
Actionable comments posted: 2
♻️ Duplicate comments (2)
src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeTypography.cs (1)
20-65: 🗄️ Data Integrity & Integration | 🟠 Major | 🏗️ Heavy liftBreaking narrowing of
BitThemeTypographyVariantsstill appears unresolved.A prior review flagged that stripping
FontFamily,TextTransform, andDisplayoff the shared base type is a breaking change for consumers and persisted theme JSON. This version still narrows the base to onlyMargin/FontWeight/FontSize/LineHeight/LetterSpacing, and only re-addsTextTransform/DisplayviaBitThemeLabelTypographyVariants(used byButton/Overline) andFontFamilyviaBitThemeInheritTypographyVariants(used byInherit). Any consumer code that previously setFontFamily,TextTransform, orDisplayonH1-H6,Subtitle1/Subtitle2,Body1/Body2, orCaption1/Caption2will now fail to compile, and any previously-serialized theme JSON with those fields on those variants will silently drop them on deserialization. Unless this narrowing is an intentional, documented breaking change for this release, consider retaining obsolete compatibility properties or gating this behind a versioned migration.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeTypography.cs` around lines 20 - 65, Restore FontFamily, TextTransform, and Display on BitThemeTypographyVariants so existing consumer code and persisted theme JSON for all typography variants remain compatible. Keep the specialized BitThemeLabelTypographyVariants and BitThemeInheritTypographyVariants members if needed for the intended variant behavior, but do not remove these properties from the shared base type unless this release explicitly includes the documented breaking change and migration.src/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scss (1)
1-1: 📐 Maintainability & Code Quality | 🟡 Minor | 💤 Low valueRemove the
.scssextension from the partial import to satisfy stylelint.This issue was previously flagged and is still present. The import should omit the
.scssextension to comply with thescss/load-partial-extensionrule.💡 Proposed fix
-@import "../../../Styles/functions.scss"; +@import "../../../Styles/functions";🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scss` at line 1, Update the import in BitGrid.scss to reference the functions partial without the .scss extension, preserving the existing relative path and satisfying the scss/load-partial-extension rule.Source: Linters/SAST tools
🧹 Nitpick comments (1)
src/BlazorUI/Bit.BlazorUI/Components/Inputs/Toggle/BitToggle.scss (1)
48-72: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winInvalid-state toggle doesn't get the error-colored focus ring.
BitOtpInput.scssandBitChoiceGroup.scssboth override the focus ring color to$clr-err-focusinside their.bit-invblock, but.bit-tgl.bit-inv .bit-tgl-btnhas no such override, so an invalid, keyboard-focused toggle shows the default primary focus ring instead of the error-themed ring.♻️ Suggested fix
&.bit-inv { .bit-tgl-btn { border-color: $clr-err; + + &:focus-visible { + `@include` focus-ring($clr-err-focus); + } }Also applies to: 123-126
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Toggle/BitToggle.scss` around lines 48 - 72, Update the .bit-inv styles in the toggle stylesheet so .bit-tgl-btn uses $clr-err-focus for its keyboard focus ring, matching the invalid-state behavior of BitOtpInput.scss and BitChoiceGroup.scss while preserving the existing error border and background styling.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In
`@src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scss`:
- Around line 16-19: Update the focus-ring selectors in BitButtonGroup.scss
lines 16-19 and BitMenuButton.scss lines 16-19: replace each group-level
:focus-within condition with :has(:focus-visible), preserving the existing
direct :focus-visible selector and focus-ring mixin so rings appear only for
keyboard-visible focus.
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scss`:
- Around line 12-14: Update the color variant blocks in the BitCheckbox styles
to define the corresponding --bit-chb-clr-focus custom property for every
supported variant, matching the pattern used by sibling components. Ensure the
existing focus-visible block’s focus-ring mixin resolves the selected checkbox
Color instead of its primary default.
---
Duplicate comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scss`:
- Line 1: Update the import in BitGrid.scss to reference the functions partial
without the .scss extension, preserving the existing relative path and
satisfying the scss/load-partial-extension rule.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeTypography.cs`:
- Around line 20-65: Restore FontFamily, TextTransform, and Display on
BitThemeTypographyVariants so existing consumer code and persisted theme JSON
for all typography variants remain compatible. Keep the specialized
BitThemeLabelTypographyVariants and BitThemeInheritTypographyVariants members if
needed for the intended variant behavior, but do not remove these properties
from the shared base type unless this release explicitly includes the documented
breaking change and migration.
---
Nitpick comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Toggle/BitToggle.scss`:
- Around line 48-72: Update the .bit-inv styles in the toggle stylesheet so
.bit-tgl-btn uses $clr-err-focus for its keyboard focus ring, matching the
invalid-state behavior of BitOtpInput.scss and BitChoiceGroup.scss while
preserving the existing error border and background styling.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: 0be8e4fd-23f0-4435-abce-438629002517
📒 Files selected for processing (139)
src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/OtpInput/BitOtpInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TagsInput/BitTagsInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Toggle/BitToggle.scsssrc/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scsssrc/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.razor.cssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.tssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQueryJsRuntimeExtensions.cssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitScreenQuery.cssrc/BlazorUI/Bit.BlazorUI/Extensions/IBitBlazorUIServiceCollectionExtensions.cssrc/BlazorUI/Bit.BlazorUI/Extensions/JsInterop/IJSRuntimeExtensions.cssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/forced-colors.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/motion.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/semantic-tokens.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/bit-css.scsssrc/BlazorUI/Bit.BlazorUI/Styles/functions.scsssrc/BlazorUI/Bit.BlazorUI/Styles/media-queries.scsssrc/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scsssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitAccentColorPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeLoader.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme.tssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitTheme.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBoxShadows.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBreakpoints.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeColors.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeLayout.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeMotion.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeShapes.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeTypography.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeAttributeNames.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeBreakpointDefaults.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeChangedEventArgs.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorContrast.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorDerivation.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeCookie.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeDensityPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsNotifierReceiver.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeMapper.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeName.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeNotifications.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeProvider.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSerialization.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSsr.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeUtilities.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.tssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/BitButtonGroupDemo.razor.scsssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/ThemingPage.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Scripts/app.tssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorContrastTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorDerivationTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeManagerTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeMapperContractTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeMapperMergeDriftTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeModelCoverageTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeProviderHtmlAttributesTest.razorsrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeProviderTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeSsrTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeTestGraph.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/ThemeProbeConsumer.cs
💤 Files with no reviewable changes (1)
- src/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.ts
Member
Author
|
@coderabbitai full-review |
|
✅ Action performedFull review finished. |
There was a problem hiding this comment.
Actionable comments posted: 2
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scss (1)
323-351: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick winAdd fallbacks for derived disabled color variables.
var(--bit-chg-clr-dis)andvar(--bit-chg-clr-dis-text)reference variant-provided variables without fallback values, causing unpredictable resolution when a choice group lacks a color variant class. Add fallbacks to ensure predictable disabled styling (e.g.,#{$clr-fg-dis}for text,#{$clr-bg-dis}for borders/backgrounds).🛠️ Proposed fix
.bit-chg-ids { .bit-chg-rad { cursor: default; pointer-events: none; - color: var(--bit-chg-clr-dis-text); + color: var(--bit-chg-clr-dis-text, #{$clr-fg-dis}); &::before { - border-color: var(--bit-chg-clr-dis); + border-color: var(--bit-chg-clr-dis, #{$clr-bg-dis}); } &::after { - background-color: var(--bit-chg-clr-dis); + background-color: var(--bit-chg-clr-dis, #{$clr-bg-dis}); } } .bit-chg-ili { cursor: default; border-color: transparent; - color: var(--bit-chg-clr-dis-text); + color: var(--bit-chg-clr-dis-text, #{$clr-fg-dis}); `@media` (hover: hover) { &:hover { border-color: transparent; } } } .bit-chg-icw { - color: var(--bit-chg-clr-dis-text); + color: var(--bit-chg-clr-dis-text, #{$clr-fg-dis}); } .bit-chg-ico { - color: var(--bit-chg-clr-dis-text); + color: var(--bit-chg-clr-dis-text, #{$clr-fg-dis}); } }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scss` around lines 323 - 351, Update the disabled styling selectors around .bit-chg-ili, .bit-chg-icw, and .bit-chg-ico to provide Sass fallbacks for --bit-chg-clr-dis-text and --bit-chg-clr-dis using the established disabled foreground and background color variables. Apply the foreground fallback to text colors and the background fallback to border and background colors, while preserving variant-provided values when available.
♻️ Duplicate comments (2)
src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss (1)
11-21: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick winAdd fallbacks for disabled color variables across components.
Several components consume component-level disabled CSS variables (e.g.
--bit-pvt-clr-dis-text,--bit-ico-clr-dis,--bit-lnk-clr-dis) without a fallback value. If the component does not have a specific color variant class applied, these variables will be undefined, leading to unpredictable disabled-state rendering. Provide the standard$clr-fg-disor$clr-bg-disfallbacks.
src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss#L11-L21: Add fallbacks for--bit-pvt-clr-dis-textand--bit-pvt-clr-dis(e.g.,var(--bit-pvt-clr-dis-text, #{$clr-fg-dis})).src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss#L241-L245: Add fallbacks for--bit-pvt-clr-dis-textand--bit-pvt-clr-dis.src/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scss#L9-L11: Add fallback for--bit-ico-clr-dis-text.src/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scss#L20-L36: Add fallbacks for--bit-ico-clr-dis-textand--bit-ico-clr-dis.src/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scss#L46-L48: Add fallback for--bit-ico-clr-dis-text.src/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scss#L31-L39: Add fallback for--bit-lnk-clr-dis.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss` around lines 11 - 21, Disabled component color variables lack standard fallbacks, causing undefined disabled-state styles. Update the disabled color declarations in src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss lines 11-21 and 241-245, src/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scss lines 9-11, 20-36, and 46-48, and src/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scss lines 31-39 to use $clr-fg-dis for text variables and $clr-bg-dis for background variables while preserving their existing component-level variable overrides.src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razor.samples.cs (1)
121-124: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick winWrap disabled Background variants in a styled container to match the rendered demo.
The disabled
PrimaryBackground,SecondaryBackground, andTertiaryBackgroundBitLinksamples should be wrapped in the same styled containerdivused in the rendered demo (and similarly to other components likeBitTagandBitChoiceGroup) to ensure the sample code matches the live presentation and preserves contrast when copied by users.💡 Suggested markup
+<div style="background:var(--bit-clr-fg-sec);padding:1rem"> <BitLink IsEnabled="false" Color="BitColor.PrimaryBackground" Href="https://github.com/bitfoundation/bitplatform">PrimaryBackground</BitLink> <BitLink IsEnabled="false" Color="BitColor.SecondaryBackground" Href="https://github.com/bitfoundation/bitplatform">SecondaryBackground</BitLink> <BitLink IsEnabled="false" Color="BitColor.TertiaryBackground" Href="https://github.com/bitfoundation/bitplatform">TertiaryBackground</BitLink> +</div>🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razor.samples.cs` around lines 121 - 124, Wrap the disabled PrimaryBackground, SecondaryBackground, and TertiaryBackground BitLink samples in BitLinkDemo’s existing styled container div, matching the container structure used by the rendered demo and analogous BitTag or BitChoiceGroup samples. Keep the link attributes and labels unchanged.
🧹 Nitpick comments (3)
src/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.razor.cs (1)
83-99: 🚀 Performance & Scalability | 🔵 Trivial | ⚖️ Poor tradeoffOptional: predefined
ScreenQueryre-invokes JS setup on every render.Because
screenQuery is not nullshort-circuits theeffectiveKey != _querycheck,BitMediaQuerySetupis called on everyOnAfterRenderAsyncfor predefined screen queries. The JS side reuses the listener when the resolved expression is unchanged, so there's no listener churn, but the interop round-trip still occurs each render — noticeable for aScreenQueryconsumer under a frequently re-rendering parent. If breakpoint changes are rare, consider gating re-setup on a cheap theme/breakpoint version token instead of running it unconditionally.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.razor.cs` around lines 83 - 99, Update the re-setup condition in OnAfterRenderAsync so predefined ScreenQuery values do not invoke BitMediaQuerySetup on every render. Gate re-setup with a cheap theme/breakpoint version or change token, while preserving setup when effectiveKey changes and allowing breakpoint updates to trigger a new setup.src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cs (1)
201-244: 🩺 Stability & Availability | 🔵 Trivial | ⚡ Quick winBroaden the dispose-time catch to avoid throwing from
DisposeAsync.Only
JSDisconnectedException/JSExceptionare swallowed around the unregister call. A JS-interop timeout surfaces asTaskCanceledException(anOperationCanceledException, not aJSException), which would propagate out ofDisposeAsync. Thefinallyat Line 230-238 already cleans up local state correctly either way, so this only affects whether the exception escapes — but an escaping exception fromIAsyncDisposable.DisposeAsync()can disrupt cleanup ordering of the rest of a DI scope during teardown.♻️ Proposed fix
catch (JSDisconnectedException) { } // circuit gone - nothing to unregister - catch (JSException ex) + catch (Exception ex) when (ex is JSException or OperationCanceledException) { // Missing JS module (e.g. after a page refresh or navigation) - safe to ignore at - // teardown. Route through ILogger when a factory was provided so hosts get their - // configured pipeline (Console.WriteLine bypasses logging filters and shows up - // raw in production terminals). + // teardown, same as an interop call that timed out (OperationCanceledException). + // Route through ILogger when a factory was provided so hosts get their configured + // pipeline (Console.WriteLine bypasses logging filters and shows up raw in prod). _logger?.LogDebug(ex, "BitBlazorUI.Theme.unregisterDotNetNotifier failed during dispose; ignoring."); }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cs` around lines 201 - 244, Broaden the exception handling around BitThemeUnregisterDotNetNotifier in DisposeAsync to swallow OperationCanceledException, including TaskCanceledException, during teardown. Preserve the existing cleanup in the finally block and continue logging only unexpected JSException failures without allowing cancellation from the unregister call to escape DisposeAsync.src/BlazorUI/Bit.BlazorUI/Extensions/JsInterop/IJSRuntimeExtensions.cs (1)
96-129: 🩺 Stability & Availability | 🔵 Trivial | ⚡ Quick winConsider matching by full type name for extra safety; verify internal members remain stable across targeted .NET versions.
BuildRuntimeInvalidProbematches solely ontype.Name("RemoteJSRuntime", "WebViewJSRuntime"), so any unrelatedIJSRuntimeimplementation sharing that short name (custom wrapper, test double, etc.) would have unrelated internal members probed. The null-member guard keeps this safe (falls back to "valid"), so it's a low-probability, low-impact identification gap rather than a crash risk.More importantly, this relies on framework-internal, non-public members (
RemoteJSRuntime.IsInitialized,WebViewJSRuntime._ipcSender) across three targetedMicrosoft.AspNetCore.Components.Webversions (8.0.0/9.0.0/10.0.0). These are known-fragile internals (confirmed via community reports of the same reflection workaround), so a silent shift in name/visibility in any targeted version would silently degrade to "always valid" rather than surface as a test failure.💡 Suggested tightening
- switch (type.Name) + switch (type.FullName ?? type.Name) { - case "UnsupportedJavaScriptRuntime": // Prerendering + case "Microsoft.AspNetCore.Components.Web.Infrastructure.UnsupportedJavaScriptRuntime": // Prerendering return static _ => true; ...Recommend adding/expanding a targeted test (or CI matrix run) per targeted TFM to catch a silent regression in these internal member names.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Extensions/JsInterop/IJSRuntimeExtensions.cs` around lines 96 - 129, Update BuildRuntimeInvalidProbe to identify framework runtimes by full type name rather than type.Name, preventing unrelated implementations from matching. Add targeted coverage or CI execution for each supported .NET target version that verifies the RemoteJSRuntime.IsInitialized and WebViewJSRuntime._ipcSender probes still resolve and preserve invalid-runtime detection when those internal members change.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss`:
- Around line 942-979: Import functions.scss in bit-css.scss before the
.bit-css-shd-focus-ring:focus-visible rule uses the focus-ring mixin, ensuring
the existing `@include` focus-ring resolves while leaving the focus color
utilities unchanged.
In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor`:
- Around line 490-495: Update the disabled Primary sample in
_BitChoiceGroupCustomDemo.razor (lines 490-495) and
_BitChoiceGroupCustomDemo.razor.samples.cs (lines 772-777) to set Color to
BitColor.Primary and change the Label from "Primary (default)" to "Primary" in
both sites.
---
Outside diff comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scss`:
- Around line 323-351: Update the disabled styling selectors around
.bit-chg-ili, .bit-chg-icw, and .bit-chg-ico to provide Sass fallbacks for
--bit-chg-clr-dis-text and --bit-chg-clr-dis using the established disabled
foreground and background color variables. Apply the foreground fallback to text
colors and the background fallback to border and background colors, while
preserving variant-provided values when available.
---
Duplicate comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss`:
- Around line 11-21: Disabled component color variables lack standard fallbacks,
causing undefined disabled-state styles. Update the disabled color declarations
in src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss lines 11-21 and
241-245, src/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scss lines
9-11, 20-36, and 46-48, and
src/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scss lines 31-39 to
use $clr-fg-dis for text variables and $clr-bg-dis for background variables
while preserving their existing component-level variable overrides.
In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razor.samples.cs`:
- Around line 121-124: Wrap the disabled PrimaryBackground, SecondaryBackground,
and TertiaryBackground BitLink samples in BitLinkDemo’s existing styled
container div, matching the container structure used by the rendered demo and
analogous BitTag or BitChoiceGroup samples. Keep the link attributes and labels
unchanged.
---
Nitpick comments:
In
`@src/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.razor.cs`:
- Around line 83-99: Update the re-setup condition in OnAfterRenderAsync so
predefined ScreenQuery values do not invoke BitMediaQuerySetup on every render.
Gate re-setup with a cheap theme/breakpoint version or change token, while
preserving setup when effectiveKey changes and allowing breakpoint updates to
trigger a new setup.
In `@src/BlazorUI/Bit.BlazorUI/Extensions/JsInterop/IJSRuntimeExtensions.cs`:
- Around line 96-129: Update BuildRuntimeInvalidProbe to identify framework
runtimes by full type name rather than type.Name, preventing unrelated
implementations from matching. Add targeted coverage or CI execution for each
supported .NET target version that verifies the RemoteJSRuntime.IsInitialized
and WebViewJSRuntime._ipcSender probes still resolve and preserve
invalid-runtime detection when those internal members change.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cs`:
- Around line 201-244: Broaden the exception handling around
BitThemeUnregisterDotNetNotifier in DisposeAsync to swallow
OperationCanceledException, including TaskCanceledException, during teardown.
Preserve the existing cleanup in the finally block and continue logging only
unexpected JSException failures without allowing cancellation from the
unregister call to escape DisposeAsync.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: e5d3422e-a0f3-43c8-af3c-230c916e8863
📒 Files selected for processing (139)
src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/OtpInput/BitOtpInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TagsInput/BitTagsInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Toggle/BitToggle.scsssrc/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scsssrc/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.razor.cssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.tssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQueryJsRuntimeExtensions.cssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitScreenQuery.cssrc/BlazorUI/Bit.BlazorUI/Extensions/IBitBlazorUIServiceCollectionExtensions.cssrc/BlazorUI/Bit.BlazorUI/Extensions/JsInterop/IJSRuntimeExtensions.cssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/forced-colors.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/motion.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/semantic-tokens.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/bit-css.scsssrc/BlazorUI/Bit.BlazorUI/Styles/functions.scsssrc/BlazorUI/Bit.BlazorUI/Styles/media-queries.scsssrc/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scsssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitAccentColorPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeLoader.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme.tssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitTheme.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBoxShadows.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBreakpoints.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeColors.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeLayout.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeMotion.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeShapes.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeTypography.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeAttributeNames.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeBreakpointDefaults.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeChangedEventArgs.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorContrast.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorDerivation.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeCookie.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeDensityPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsNotifierReceiver.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeMapper.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeName.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeNotifications.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeProvider.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSerialization.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSsr.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeUtilities.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.tssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/BitButtonGroupDemo.razor.scsssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/ThemingPage.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Scripts/app.tssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorContrastTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorDerivationTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeManagerTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeMapperContractTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeMapperMergeDriftTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeModelCoverageTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeProviderHtmlAttributesTest.razorsrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeProviderTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeSsrTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeTestGraph.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/ThemeProbeConsumer.cs
💤 Files with no reviewable changes (1)
- src/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.ts
Member
Author
|
@coderabbitai full-review |
|
✅ Action performedFull review finished. |
There was a problem hiding this comment.
Actionable comments posted: 4
♻️ Duplicate comments (6)
src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss (1)
1-1: 📐 Maintainability & Code Quality | 🟡 Minor | 💤 Low valueDrop
.scssextension in the import path.The
@importstatement uses the.scssextension, which violates thescss/load-partial-extensionrule.♻️ Proposed patch
-@import "functions.scss"; +@import "functions";🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss` at line 1, Update the top-level `@import` statement in bit-css.scss to reference the functions partial without the .scss extension, complying with the scss/load-partial-extension rule.Source: Linters/SAST tools
src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss (1)
134-136: 🎯 Functional Correctness | 🟠 Major | ⚡ Quick winAdd fallbacks for dynamically bound focus and disabled color variables.
CSS variables resolving to focus and disabled variant tokens lack fallback values. If a component is rendered without a color variant class, these variables remain undefined, causing disabled components to unexpectedly inherit enabled colors and
focus-ringto render without a visible indicator.
src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss#L134-L136: add fallbacks (e.g.#{$clr-fg-dis},#{$clr-bg-dis}) to--bit-btn-clr-dis-textand--bit-btn-clr-dis. Apply the same pattern to other.bit-disvariants and to--bit-btn-clr-focus(line 23).src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scss#L37-L38: add#{$clr-fg-dis}as a fallback for--bit-acb-clr-dis-text. Apply#{$clr-pri-focus}as a fallback to--bit-acb-clr-focus(line 29).src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scss#L27-L28: add fallbacks for--bit-btg-clr-dis-textand--bit-btg-clr-dis. Apply the same pattern to.bit-btg-itm[disabled](lines 78-80) and--bit-btg-clr-focus(line 18).🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss` around lines 134 - 136, Update the dynamic focus and disabled CSS variable declarations so they include the corresponding Sass token fallbacks, preserving enabled colors when variant classes are absent. In src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss lines 134-136, add disabled foreground/background fallbacks and apply the same pattern to other .bit-dis variants and --bit-btn-clr-focus; in src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scss lines 37-38, add the disabled foreground and focus fallbacks; in src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scss lines 27-28, add disabled foreground/background fallbacks, repeat them for .bit-btg-itm[disabled] lines 78-80, and add the focus fallback.src/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scss (1)
31-39: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick winAdd fallback value for disabled color variable.
The
var(--bit-lnk-clr-dis)variable lacks a fallback. If a link does not have a color variant class applied, this variable is undefined and the disabled text color will not fall back properly to the theme's default disabled color.🎯 Proposed fix
&.bit-dis { cursor: default; - color: var(--bit-lnk-clr-dis); + color: var(--bit-lnk-clr-dis, #{$clr-fg-dis}); &:hover, &:active, &:focus { - color: var(--bit-lnk-clr-dis); + color: var(--bit-lnk-clr-dis, #{$clr-fg-dis}); }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scss` around lines 31 - 39, Update the disabled-link styles in the .bit-dis selector and its hover, active, and focus states to provide the theme’s default disabled color as the fallback for --bit-lnk-clr-dis when the custom variable is undefined.src/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scss (1)
10-10: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick winAdd fallbacks for disabled color variables.
These CSS variables are used without fallbacks. If an icon is rendered without a specific color variant class (e.g., just
.bit-ico), these variables will be undefined, leading to unpredictable disabled colors. Please provide fallbacks to the standard disabled tokens.🎯 Proposed fix
.bit-ico { padding: spacing(0.5); border-radius: $shp-border-radius; border-style: $shp-border-style; border-width: $shp-border-width; &.bit-dis { - color: var(--bit-ico-clr-dis-text); + color: var(--bit-ico-clr-dis-text, #{$clr-fg-dis}); } } .bit-ico-fil { color: var(--bit-ico-clr-txt); border-color: var(--bit-ico-clr); background-color: var(--bit-ico-clr); &.bit-dis { - color: var(--bit-ico-clr-dis-text); - border-color: var(--bit-ico-clr-dis); - background-color: var(--bit-ico-clr-dis); + color: var(--bit-ico-clr-dis-text, #{$clr-fg-dis}); + border-color: var(--bit-ico-clr-dis, #{$clr-fg-dis}); + background-color: var(--bit-ico-clr-dis, #{$clr-fg-dis}); } } .bit-ico-out { color: var(--bit-ico-clr); border-color: var(--bit-ico-clr); background-color: transparent; &.bit-dis { - color: var(--bit-ico-clr-dis-text); - border-color: var(--bit-ico-clr-dis); + color: var(--bit-ico-clr-dis-text, #{$clr-fg-dis}); + border-color: var(--bit-ico-clr-dis, #{$clr-fg-dis}); background-color: transparent; } } .bit-ico-txt { color: var(--bit-ico-clr); border-color: transparent; background-color: transparent; border: none; padding: 0; &.bit-dis { - color: var(--bit-ico-clr-dis-text); + color: var(--bit-ico-clr-dis-text, #{$clr-fg-dis}); } }Also applies to: 21-23, 33-35, 47-47
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scss` at line 10, Add fallback values to the disabled color declarations in BitIcon styles, including the referenced variables at the other affected selectors. Use the standard disabled color tokens as fallbacks so icons without a color-variant class retain predictable disabled colors.src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razor.cs (1)
1394-1490: 🗄️ Data Integrity & Integration | 🟡 Minor | ⚡ Quick winDisabled
*Backgroundsamples still missing the contrast wrapper.
PrimaryBackground/SecondaryBackground/TertiaryBackgrounddisabled samples here render against the default page background — the sibling_BitMenuButtonItemDemo.razor.samples.csand the live_BitMenuButtonOptionDemo.razorboth wrap the equivalent block in<div style="background:var(--bit-clr-fg-sec);padding:1rem">. This was flagged before and marked addressed, but the fix is not present in this diff.🛠️ Suggested fix
+<div style=""background:var(--bit-clr-fg-sec);padding:1rem""> <BitMenuButton Text=""PrimaryBackground"" TItem=""BitMenuButtonOption"" Variant=""BitVariant.Fill"" Color=""BitColor.PrimaryBackground"" IsEnabled=""false""> ... </BitMenuButton> ... <BitMenuButton Text=""TertiaryBackground"" TItem=""BitMenuButtonOption"" Variant=""BitVariant.Text"" Color=""BitColor.TertiaryBackground"" IsEnabled=""false"" Split> ... </BitMenuButton> +</div>🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razor.cs` around lines 1394 - 1490, Wrap the disabled PrimaryBackground, SecondaryBackground, and TertiaryBackground BitMenuButton sample blocks in the same contrast container used by the sibling demos: a div with background var(--bit-clr-fg-sec) and padding 1rem. Keep all existing button variants, colors, split states, and options unchanged.src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/ThemingPage.razor (1)
973-1004: 🎯 Functional Correctness | 🟠 Major | ⚡ Quick winSample code still has malformed nested quotes — persists across two prior review rounds.
Text="@(_isDark ? "Light" : "Dark")"nests literal"characters inside the double-quoted attribute value. This was flagged twice before (once suggesting outer single quotes, once flagging a regression to invalid'Light'/'Dark'char literals), but the code shown here is back to the original broken nested-double-quote form. Copying this snippet as-is produces invalid Razor markup.🐛 Suggested fix
-<BitToggleButton Text="@@(_isDark ? "Light" : "Dark")" OnClick="ToggleTheme" /> +<BitToggleButton Text='@@(_isDark ? "Light" : "Dark")' OnClick="ToggleTheme" />🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/ThemingPage.razor` around lines 973 - 1004, Fix the BitToggleButton Text attribute in the theming sample so the conditional Light/Dark string expression uses valid Razor attribute quoting without nested unescaped double quotes. Preserve _isDark and the existing ToggleTheme handler, and ensure Light and Dark remain string values rather than character literals.
🧹 Nitpick comments (3)
src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeName.cs (1)
61-82: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winExtract shared theme-token validation instead of duplicating it in two files.
BitThemeName.CustomandBitThemeSsr.NormalizeThemeTokenindependently implement the same trim/lowercase + length<=64 +[a-z0-9-]allowlist rule. Both files' docs explicitly call out that runtime and SSR token rules must stay aligned for first-paint consistency, and a mismatch here was already flagged and fixed once in an earlier review round — keeping two copies risks that drift recurring silently on a future edit.
src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeName.cs#L61-L82: extract the trim/length/allowlist logic into a shared internal static helper (e.g. onBitThemeUtilitiesor a new small internal type) and call it fromCustom().src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSsr.cs#L111-L131: replaceNormalizeThemeToken's inline logic with a call to the same shared helper (adjusting for thenull-on-invalid vs. throw-on-invalid return contracts each call site needs).🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeName.cs` around lines 61 - 82, Extract the shared trim, lowercase, maximum-length, and character-allowlist validation used by BitThemeName.Custom and BitThemeSsr.NormalizeThemeToken into one internal helper. Update src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeName.cs lines 61-82 to call it while preserving throwing validation behavior, and update src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSsr.cs lines 111-131 to call the same helper while preserving its null-on-invalid contract.src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor (1)
634-758: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winPivot "Color" demo lost coverage for themed Background/Foreground/Border colors.
The rewritten Color demo standardizes item labels across the 8 base
BitColorvalues (Primary–Error) plus 3 Tab variants, but no longer demosPrimaryBackground/SecondaryBackground/TertiaryBackground/PrimaryForeground/SecondaryForeground/TertiaryForeground/PrimaryBorder/SecondaryBorder/TertiaryBorder— all of which remain documented in this file's owncolor-enumcomponentSubEnumsentry (values 8-16). The line-range change metadata for the.razor.cscounterpart explicitly notes the prior version used header texts like "Primary bg/Secondary bg/Tertiary fg", suggesting these themed-color examples existed before this rewrite and were dropped, likely as a side effect of consolidating duplicate per-color markup rather than an intentional scope reduction.
src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor#L634-L758: add backBitPivot Color="BitColor.PrimaryBackground"(and Secondary/Tertiary Background, Foreground, Border) examples to the ColorDemoExample, following the sameFile/Shared/Recentitem pattern used for the other colors.src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cs#L1279-L1344: mirror the same additions inexample12RazorCodeso the raw sample code shown to users matches the rendered demo.Please confirm whether this removal was intentional (e.g., these color roles don't make sense for Pivot) before restoring; if intentional, consider removing the corresponding enum entries' relevance note or clarifying in the parameter table instead.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor` around lines 634 - 758, Restore the themed color coverage in the Color DemoExample by adding PrimaryBackground, SecondaryBackground, TertiaryBackground, PrimaryForeground, SecondaryForeground, TertiaryForeground, PrimaryBorder, SecondaryBorder, and TertiaryBorder BitPivot examples using the existing File/Shared/Recent pattern. Mirror these additions in example12RazorCode so the displayed source matches the rendered demo; update both sites: BitPivotDemo.razor lines 634-758 and BitPivotDemo.razor.cs lines 1279-1344.src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor (1)
365-521: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winDisabled "Primary" sample should be explicit, matching the already-fixed sibling ChoiceGroup demos. Both sites render the disabled Primary sample with
Label="Primary (default)"and no explicitColor, relying on the implicit default — the same inconsistency already fixed in_BitChoiceGroupCustomDemo.razor/.razor.samples.cs(which now setColor="BitColor.Primary" Label="Primary").
src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor#L369-L374: addColor="BitColor.Primary"and changeLabelto"Primary".src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cs#L561-L565: addColor="BitColor.Primary"and changeLabelto"Primary".🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor` around lines 365 - 521, Make the disabled Primary ChoiceGroup samples explicit in both _BitChoiceGroupItemDemo.razor (lines 365-521) and _BitChoiceGroupItemDemo.razor.samples.cs (lines 559-679): set Color to BitColor.Primary and change the label from “Primary (default)” to “Primary” for the affected samples.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scss`:
- Around line 166-169: Add the --bit-chg-clr-focus token to every .bit-chg-*
color variant block in BitChoiceGroup.scss, matching the corresponding variant
focus colors used by sibling components. Keep the existing focus-visible rule
and focus-ring mixin unchanged so each choice item’s ring resolves to its
variant-specific color.
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss`:
- Around line 40-42: Update the focus styles for `.bit-inv.bit-drp-nbd
.bit-drp-wrp:focus`, `.bit-dis .bit-drp-wrp:focus`, and `.bit-drp-nbd
.bit-drp-wrp:focus` to add `outline: none;` alongside the existing `box-shadow:
none;`, fully suppressing the focus indicator including forced-colors mode.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cs`:
- Around line 176-199: Update EnsureJsNotifierRegisteredAsync around
BitThemeRegisterDotNetNotifier to catch JSDisconnectedException from the
registration await and return without propagating it. Preserve the existing
semaphore release and leave _jsNotifierRegistered false so later calls can
retry, maintaining the public methods’ null-on-disconnect behavior.
In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/ThemingPage.razor`:
- Around line 754-756: Update the breakpoint values and list in the BitText
containing BitThemeBreakpointDefaults to match Xs = 0px, Sm = 600px, Md = 960px,
Lg = 1280px, Xl = 1920px, and Xxl = 2560px, including the newly required Xxl
entry.
---
Duplicate comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss`:
- Around line 134-136: Update the dynamic focus and disabled CSS variable
declarations so they include the corresponding Sass token fallbacks, preserving
enabled colors when variant classes are absent. In
src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss lines
134-136, add disabled foreground/background fallbacks and apply the same pattern
to other .bit-dis variants and --bit-btn-clr-focus; in
src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scss
lines 37-38, add the disabled foreground and focus fallbacks; in
src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scss
lines 27-28, add disabled foreground/background fallbacks, repeat them for
.bit-btg-itm[disabled] lines 78-80, and add the focus fallback.
In `@src/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scss`:
- Line 10: Add fallback values to the disabled color declarations in BitIcon
styles, including the referenced variables at the other affected selectors. Use
the standard disabled color tokens as fallbacks so icons without a color-variant
class retain predictable disabled colors.
In `@src/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scss`:
- Around line 31-39: Update the disabled-link styles in the .bit-dis selector
and its hover, active, and focus states to provide the theme’s default disabled
color as the fallback for --bit-lnk-clr-dis when the custom variable is
undefined.
In `@src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss`:
- Line 1: Update the top-level `@import` statement in bit-css.scss to reference
the functions partial without the .scss extension, complying with the
scss/load-partial-extension rule.
In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razor.cs`:
- Around line 1394-1490: Wrap the disabled PrimaryBackground,
SecondaryBackground, and TertiaryBackground BitMenuButton sample blocks in the
same contrast container used by the sibling demos: a div with background
var(--bit-clr-fg-sec) and padding 1rem. Keep all existing button variants,
colors, split states, and options unchanged.
In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/ThemingPage.razor`:
- Around line 973-1004: Fix the BitToggleButton Text attribute in the theming
sample so the conditional Light/Dark string expression uses valid Razor
attribute quoting without nested unescaped double quotes. Preserve _isDark and
the existing ToggleTheme handler, and ensure Light and Dark remain string values
rather than character literals.
---
Nitpick comments:
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeName.cs`:
- Around line 61-82: Extract the shared trim, lowercase, maximum-length, and
character-allowlist validation used by BitThemeName.Custom and
BitThemeSsr.NormalizeThemeToken into one internal helper. Update
src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeName.cs lines 61-82 to call it
while preserving throwing validation behavior, and update
src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSsr.cs lines 111-131 to call the
same helper while preserving its null-on-invalid contract.
In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor`:
- Around line 365-521: Make the disabled Primary ChoiceGroup samples explicit in
both _BitChoiceGroupItemDemo.razor (lines 365-521) and
_BitChoiceGroupItemDemo.razor.samples.cs (lines 559-679): set Color to
BitColor.Primary and change the label from “Primary (default)” to “Primary” for
the affected samples.
In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor`:
- Around line 634-758: Restore the themed color coverage in the Color
DemoExample by adding PrimaryBackground, SecondaryBackground,
TertiaryBackground, PrimaryForeground, SecondaryForeground, TertiaryForeground,
PrimaryBorder, SecondaryBorder, and TertiaryBorder BitPivot examples using the
existing File/Shared/Recent pattern. Mirror these additions in
example12RazorCode so the displayed source matches the rendered demo; update
both sites: BitPivotDemo.razor lines 634-758 and BitPivotDemo.razor.cs lines
1279-1344.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: 58519d86-bef6-4009-b38b-f37444ed90f0
📒 Files selected for processing (139)
src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/OtpInput/BitOtpInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TagsInput/BitTagsInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Toggle/BitToggle.scsssrc/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scsssrc/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.razor.cssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.tssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQueryJsRuntimeExtensions.cssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitScreenQuery.cssrc/BlazorUI/Bit.BlazorUI/Extensions/IBitBlazorUIServiceCollectionExtensions.cssrc/BlazorUI/Bit.BlazorUI/Extensions/JsInterop/IJSRuntimeExtensions.cssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/forced-colors.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/motion.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/semantic-tokens.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/bit-css.scsssrc/BlazorUI/Bit.BlazorUI/Styles/functions.scsssrc/BlazorUI/Bit.BlazorUI/Styles/media-queries.scsssrc/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scsssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitAccentColorPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeLoader.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme.tssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitTheme.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBoxShadows.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBreakpoints.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeColors.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeLayout.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeMotion.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeShapes.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeTypography.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeAttributeNames.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeBreakpointDefaults.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeChangedEventArgs.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorContrast.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorDerivation.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeCookie.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeDensityPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsNotifierReceiver.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeMapper.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeName.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeNotifications.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeProvider.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSerialization.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSsr.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeUtilities.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.tssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/BitButtonGroupDemo.razor.scsssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/ThemingPage.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Scripts/app.tssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorContrastTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorDerivationTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeManagerTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeMapperContractTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeMapperMergeDriftTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeModelCoverageTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeProviderHtmlAttributesTest.razorsrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeProviderTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeSsrTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeTestGraph.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/ThemeProbeConsumer.cs
💤 Files with no reviewable changes (1)
- src/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.ts
…into 12320-blazorui-theme-improvements-ii
Member
Author
|
@coderabbitai full-review |
|
✅ Action performedFull review finished. |
There was a problem hiding this comment.
Actionable comments posted: 1
♻️ Duplicate comments (2)
src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss (1)
1-1: 📐 Maintainability & Code Quality | 🟡 Minor | 💤 Low valueDrop
.scssextension in the import path.Line 1 violates
scss/load-partial-extensionand will fail stylelint.🐛 Proposed fix
-@import "functions.scss"; +@import "functions";🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss` at line 1, Update the import statement in the SCSS entrypoint to omit the .scss extension, changing the functions.scss reference to the extensionless functions partial path so it complies with scss/load-partial-extension.Source: Linters/SAST tools
src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeTypography.cs (1)
27-44: 🗄️ Data Integrity & Integration | 🟠 Major | 🏗️ Heavy liftPreserve compatibility for existing typography variants.
Narrowing
BitThemeTypographyVariantswithout obsolete properties or a migration path breaks existing consumer source code and drops serialized fields from persisted theme JSON. Please retainFontFamily,TextTransform, andDisplayas[Obsolete]properties or implement a clear migration.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeTypography.cs` around lines 27 - 44, Preserve compatibility in BitThemeTypographyVariants by retaining the removed FontFamily, TextTransform, and Display properties and marking them with [Obsolete]. Ensure they remain available for existing consumers and serialized theme JSON while keeping the current shared typography behavior unchanged.
🧹 Nitpick comments (1)
src/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeManagerTests.cs (1)
74-95: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winConsider adding a post-dispose
ObjectDisposedExceptionregression test.Coverage here is solid for registration idempotency and normalization, but there's no test asserting that a public method call after
DisposeAsync()throwsObjectDisposedException- the exact behavior two past reviews onBitThemeManager.csspecifically hardened (including for the receiver-less constructor path). A quick addition alongsideDoubleDisposeIsSafeAndDoesNotDuplicateUnregistrationwould guard against regressions in that ordering.[TestMethod] public async Task PublicMethodsThrowAfterDisposeAsync() { var manager = CreateFullyWiredManager(); await manager.DisposeAsync(); await Assert.ThrowsExceptionAsync<ObjectDisposedException>( () => manager.GetCurrentThemeAsync().AsTask()); }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeManagerTests.cs` around lines 74 - 95, Add a post-disposal regression test beside DoubleDisposeIsSafeAndDoesNotDuplicateUnregistration that disposes a fully wired manager, invokes the public GetCurrentThemeAsync method, and asserts it throws ObjectDisposedException.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss`:
- Around line 22-26: Remove the outline-offset and outline declarations from the
&:focus-visible rule in BitButton, leaving the
focus-ring(var(--bit-btn-clr-focus)) mixin as the sole focus-ring styling.
---
Duplicate comments:
In `@src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss`:
- Line 1: Update the import statement in the SCSS entrypoint to omit the .scss
extension, changing the functions.scss reference to the extensionless functions
partial path so it complies with scss/load-partial-extension.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeTypography.cs`:
- Around line 27-44: Preserve compatibility in BitThemeTypographyVariants by
retaining the removed FontFamily, TextTransform, and Display properties and
marking them with [Obsolete]. Ensure they remain available for existing
consumers and serialized theme JSON while keeping the current shared typography
behavior unchanged.
---
Nitpick comments:
In `@src/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeManagerTests.cs`:
- Around line 74-95: Add a post-disposal regression test beside
DoubleDisposeIsSafeAndDoesNotDuplicateUnregistration that disposes a fully wired
manager, invokes the public GetCurrentThemeAsync method, and asserts it throws
ObjectDisposedException.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: 0533e8de-7d84-499f-a506-34a44a450cb1
📒 Files selected for processing (139)
src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/OtpInput/BitOtpInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TagsInput/BitTagsInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Toggle/BitToggle.scsssrc/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scsssrc/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.razor.cssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.tssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQueryJsRuntimeExtensions.cssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitScreenQuery.cssrc/BlazorUI/Bit.BlazorUI/Extensions/IBitBlazorUIServiceCollectionExtensions.cssrc/BlazorUI/Bit.BlazorUI/Extensions/JsInterop/IJSRuntimeExtensions.cssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/forced-colors.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/motion.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/semantic-tokens.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/bit-css.scsssrc/BlazorUI/Bit.BlazorUI/Styles/functions.scsssrc/BlazorUI/Bit.BlazorUI/Styles/media-queries.scsssrc/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scsssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitAccentColorPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeLoader.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme.tssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitTheme.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBoxShadows.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBreakpoints.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeColors.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeLayout.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeMotion.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeShapes.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeTypography.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeAttributeNames.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeBreakpointDefaults.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeChangedEventArgs.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorContrast.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorDerivation.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeCookie.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeDensityPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsNotifierReceiver.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeMapper.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeName.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeNotifications.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeProvider.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSerialization.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSsr.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeUtilities.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.tssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/BitButtonGroupDemo.razor.scsssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/ThemingPage.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Scripts/app.tssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorContrastTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorDerivationTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeManagerTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeMapperContractTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeMapperMergeDriftTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeModelCoverageTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeProviderHtmlAttributesTest.razorsrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeProviderTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeSsrTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeTestGraph.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/ThemeProbeConsumer.cs
💤 Files with no reviewable changes (1)
- src/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.ts
Member
Author
|
@coderabbitai full-review |
|
✅ Action performedFull review finished. Your plan includes PR reviews subject to rate limits. More reviews will be available in 1 minute. |
Member
Author
|
@coderabbitai full-review |
|
✅ Action performedFull review finished. |
There was a problem hiding this comment.
Actionable comments posted: 3
♻️ Duplicate comments (3)
src/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scss (1)
1-1: 📐 Maintainability & Code Quality | 🟡 Minor | 💤 Low valueRemove the
.scssextension from the partial import.This currently triggers the
scss/load-partial-extensionrule in stylelint. Use an extensionless import instead.💡 Proposed fix
-@import "../../../Styles/functions.scss"; +@import "../../../Styles/functions";🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scss` at line 1, Update the import in BitGrid.scss to reference the functions partial without the .scss extension, preserving the existing relative path.Source: Linters/SAST tools
src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scss (2)
16-19: 🎯 Functional Correctness | 🟠 Major | ⚡ Quick winAdd a fallback to the focus ring color to prevent an invalid
box-shadow.The
@include focus-ring(var(--...-clr-focus))calls pass a CSS custom property that is only defined inside variant blocks. If a component is rendered without a color variant class, the passed variable is undefined. Because it's passed as the$colorargument, the mixin's internal fallback will try to evaluate it again (var(--bit-focus-ring-color, var(--...-clr-focus))), causing both variables to be undefined. This makes the entirebox-shadowinvalid at computed-value time, completely breaking the focus ring and violating accessibility guarantees.
src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scss#L16-L19: use@include focus-ring(var(--bit-mnb-clr-focus, #{$clr-pri-focus}));.src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scss#L20-L22: use@include focus-ring(var(--bit-tgb-clr-focus, #{$clr-pri-focus}));.src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scss#L12-L14: use@include focus-ring(var(--bit-chb-clr-focus, #{$clr-pri-focus}));.src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scss#L166-L169: use@include focus-ring(var(--bit-chg-clr-focus, #{$clr-pri-focus}));.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scss` around lines 16 - 19, Provide a primary-color fallback for the focus-ring custom property at every focus-ring include: update BitMenuButton.scss lines 16-19, BitToggleButton.scss lines 20-22, BitCheckbox.scss lines 12-14, and BitChoiceGroup.scss lines 166-169 to pass each component focus variable with #{$clr-pri-focus} as its fallback, preserving the existing focus-ring behavior when a variant defines the variable.
24-28: 🎯 Functional Correctness | 🟠 Major | ⚡ Quick winAdd fallbacks for derived disabled color variables.
When a component is rendered without a specific color variant class (e.g., no
.bit-...-pri), its custom properties like--...-clr-dis-textremain undefined. Without a fallback, properties likecolorandbackground-colorwill become invalid at computed-value time, leading to unpredictable disabled styling.
src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scss#L24-L28: add fallbacks (e.g.,var(--bit-mnb-clr-dis-text, #{$clr-fg-dis})) to the disabled variable assignments or directly in the property usages.src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scss#L58-L61: add fallbacks for--bit-tgb-clr-dis-textand--bit-tgb-clr-dis.src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scss#L44-L48: add fallbacks for--bit-chb-clr-dis-textand--bit-chb-clr-dis.src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scss#L323-L337: add fallbacks for--bit-chg-clr-dis-textand--bit-chg-clr-dis.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scss` around lines 24 - 28, Update the disabled color custom-property assignments to provide fallback values when variant-specific variables are undefined. In src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scss lines 24-28, add fallbacks for the disabled text, split-button, text, open-button text, and chevron-button text variables; apply the corresponding fallback handling to --bit-tgb-clr-dis-text and --bit-tgb-clr-dis in src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scss lines 58-61, --bit-chb-clr-dis-text and --bit-chb-clr-dis in src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scss lines 44-48, and --bit-chg-clr-dis-text and --bit-chg-clr-dis in src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scss lines 323-337, using each component’s established disabled color Sass fallback.
🧹 Nitpick comments (1)
src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss (1)
68-68: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low valueAdd an empty line before the inline SCSS comment.
This comment currently violates the
scss/double-slash-comment-empty-line-beforerule and will fail Stylelint checks.💡 Proposed fix
&:focus { color: $clr-fg-dis; border-color: $clr-brd-dis; + // Suppress the focus ring while disabled, including the forced-colors outline. outline: none; box-shadow: none; }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss` at line 68, Insert an empty line immediately before the inline SCSS comment near the disabled focus-ring styles, leaving the comment and surrounding styles unchanged so it satisfies the scss/double-slash-comment-empty-line-before rule.Source: Linters/SAST tools
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scss`:
- Around line 47-49: Disabled color custom properties lack fallbacks when
variant classes are absent. Update the disabled selectors in
src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scss lines 47-49,
59-60, and 71-71 to use the appropriate foreground, border, and background
disabled tokens; update
src/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scss lines 10-10,
21-23, 33-35, and 47-47 similarly; and update both base and hover/active/focus
disabled color usages in
src/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scss lines 33-39.
Preserve the existing custom properties while adding global disabled token
fallbacks for each color, border-color, and background-color expression.
In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razor.samples.cs`:
- Around line 343-345: Add the missing Disabled section header to the sample
code immediately before the BitActionButton with IsEnabled="false", matching the
rendered demo’s “Disabled” header and preserving the existing button sample.
In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor`:
- Around line 563-574: Update every example-content block in the Color and
Disabled sections of the button group demo: move each color/state label outside
its container, add the row class to the corresponding container as in
_BitButtonGroupCustomDemo and _BitButtonGroupItemDemo, and preserve the existing
ButtonGroup variants and content.
---
Duplicate comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scss`:
- Around line 16-19: Provide a primary-color fallback for the focus-ring custom
property at every focus-ring include: update BitMenuButton.scss lines 16-19,
BitToggleButton.scss lines 20-22, BitCheckbox.scss lines 12-14, and
BitChoiceGroup.scss lines 166-169 to pass each component focus variable with
#{$clr-pri-focus} as its fallback, preserving the existing focus-ring behavior
when a variant defines the variable.
- Around line 24-28: Update the disabled color custom-property assignments to
provide fallback values when variant-specific variables are undefined. In
src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scss lines
24-28, add fallbacks for the disabled text, split-button, text, open-button
text, and chevron-button text variables; apply the corresponding fallback
handling to --bit-tgb-clr-dis-text and --bit-tgb-clr-dis in
src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scss
lines 58-61, --bit-chb-clr-dis-text and --bit-chb-clr-dis in
src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scss lines
44-48, and --bit-chg-clr-dis-text and --bit-chg-clr-dis in
src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scss
lines 323-337, using each component’s established disabled color Sass fallback.
In `@src/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scss`:
- Line 1: Update the import in BitGrid.scss to reference the functions partial
without the .scss extension, preserving the existing relative path.
---
Nitpick comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss`:
- Line 68: Insert an empty line immediately before the inline SCSS comment near
the disabled focus-ring styles, leaving the comment and surrounding styles
unchanged so it satisfies the scss/double-slash-comment-empty-line-before rule.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: a1e060ce-45f7-45af-bc3f-e0226b8fc684
📒 Files selected for processing (139)
src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/OtpInput/BitOtpInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Slider/BitSlider.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TagsInput/BitTagsInput.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.scsssrc/BlazorUI/Bit.BlazorUI/Components/Inputs/Toggle/BitToggle.scsssrc/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scsssrc/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.scsssrc/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scsssrc/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Icon/BitIcon.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/Link/BitLink.scsssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.razor.cssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.tssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQueryJsRuntimeExtensions.cssrc/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitScreenQuery.cssrc/BlazorUI/Bit.BlazorUI/Extensions/IBitBlazorUIServiceCollectionExtensions.cssrc/BlazorUI/Bit.BlazorUI/Extensions/JsInterop/IJSRuntimeExtensions.cssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/bit.blazorui.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/forced-colors.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/motion.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/semantic-tokens.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/Fluent/shapes.fluent.scsssrc/BlazorUI/Bit.BlazorUI/Styles/bit-css.scsssrc/BlazorUI/Bit.BlazorUI/Styles/functions.scsssrc/BlazorUI/Bit.BlazorUI/Styles/media-queries.scsssrc/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scsssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitAccentColorPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeLoader.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme.tssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitTheme.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBoxShadows.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeBreakpoints.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeColors.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeLayout.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeMotion.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeShapes.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeTypography.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeAttributeNames.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeBreakpointDefaults.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeChangedEventArgs.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorContrast.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeColorDerivation.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeCookie.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeDensityPresets.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsExtensions.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeJsNotifierReceiver.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeMapper.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeName.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeNotifications.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeProvider.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSerialization.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeSsr.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeUtilities.cssrc/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.tssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ActionButton/BitActionButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/BitButtonGroupDemo.razor.scsssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/MenuButton/_BitMenuButtonOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ToggleButton/BitToggleButtonDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Icon/BitIconDemo.razor.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/Link/BitLinkDemo.razor.samples.cssrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/ThemingPage.razorsrc/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Scripts/app.tssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorContrastTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeColorDerivationTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeManagerTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeMapperContractTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeMapperMergeDriftTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeModelCoverageTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeProviderHtmlAttributesTest.razorsrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeProviderTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeSsrTests.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/BitThemeTestGraph.cssrc/BlazorUI/Tests/Bit.BlazorUI.Tests/Utils/Theme/ThemeProbeConsumer.cs
💤 Files with no reviewable changes (1)
- src/BlazorUI/Bit.BlazorUI/Utils/Theme/bit-theme.ts
…into 12320-blazorui-theme-improvements-ii
Member
Author
|
@coderabbitai full-review |
|
✅ Action performedFull review finished. Your plan includes PR reviews subject to rate limits. More reviews will be available in 28 seconds. |
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
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 #12320
Summary by CodeRabbit
:focus-visiblefocus rings/underline rings across buttons, inputs, navigation, links, breadcrumbs, and more, with improved forced-colors/high-contrast behavior.