BlazorUI theme improvements ii (#12320)#12369
Open
msynk wants to merge 70 commits into
Open
Conversation
msynk
requested review from
Cyrus-Sushiant,
Copilot,
mhrastegari,
yasmoradi and
zahra-yousefi
May 22, 2026 07:52
|
Important Review skippedAuto incremental reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: Repository UI Review profile: CHILL Plan: Pro Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
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 | ✅ 3 | ❌ 2❌ Failed checks (2 warnings)
✅ Passed checks (3 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
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. |
…into 12320-blazorui-theme-improvements-ii
Member
Author
|
@coderabbitai full-review |
…into 12320-blazorui-theme-improvements-ii
|
✅ Action performedFull review finished. |
There was a problem hiding this comment.
Actionable comments posted: 4
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/Dropdown/BitDropdown.scss (1)
4-13: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick winThread the dropdown focus color through the no-border underline ring (
src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss:105-126)..bit-drp-nbd &:focus-visiblestill uses the mixin default primary color, so Secondary/Error/etc. variants show the wrong keyboard focus cue.🤖 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 4 - 13, Update the .bit-drp-nbd &:focus-visible underline-ring usage to pass the dropdown’s configured focus color instead of relying on the mixin’s primary-color default. Reuse the color variable established in .bit-drp, preserving the existing styling for Secondary, Error, and other variants.
♻️ Duplicate comments (4)
src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cs (1)
5-13: 🎯 Functional Correctness | 🔴 Critical | ⚡ Quick win
InvokeVoiddoes not exist onIJSRuntime— useInvokeVoidAsync.
jsis anIJSRuntime, which has noInvokeVoidextension (that isIJSInProcessRuntime, and it returnsvoid, notValueTask). Both methods will fail to compile. The async void-invocation helper isInvokeVoidAsync, which returnsValueTask.🐛 Proposed fix
internal static ValueTask BitExternalThemeAttach(this IJSRuntime js, string linkElementId, string href) { - return js.InvokeVoid("BitBlazorUI.ExternalTheme.attach", linkElementId, href); + return js.InvokeVoidAsync("BitBlazorUI.ExternalTheme.attach", linkElementId, href); } internal static ValueTask BitExternalThemeDetach(this IJSRuntime js, string linkElementId) { - return js.InvokeVoid("BitBlazorUI.ExternalTheme.detach", linkElementId); + return js.InvokeVoidAsync("BitBlazorUI.ExternalTheme.detach", linkElementId); }#!/bin/bash # Confirm the idiomatic API used elsewhere in the repo for void JS interop on IJSRuntime. rg -nP '\.InvokeVoid(Async)?\s*\(' src/BlazorUI/Bit.BlazorUI --type=cs -C1🤖 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/BitExternalThemeJsExtensions.cs` around lines 5 - 13, Update BitExternalThemeAttach and BitExternalThemeDetach to call IJSRuntime.InvokeVoidAsync instead of InvokeVoid, preserving the existing JavaScript identifiers and arguments while returning the resulting ValueTask.src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeTypography.cs (1)
27-44: 🗄️ Data Integrity & Integration | 🟠 Major | 🏗️ Heavy liftNarrowing
BitThemeTypographyVariantsremains a breaking change (previously flagged, unresolved).
FontFamily,TextTransform, andDisplayare still removed from the shared base.H1–H6,Subtitle1/2,Body1/2, andCaption1/2remain typed asBitThemeTypographyVariants, so any consumer code that previously set these on those variants will fail to compile, and previously-persisted theme JSON silently drops these fields on those variants. The earlier review flagged this exact concern on a later commit without it being marked resolved. If narrowing is intentional (per the remarks about a single rootFontFamily), consider documenting this explicitly as an accepted breaking change in release notes, or providing a migration path, rather than a silent narrowing.🤖 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, Address the breaking API and JSON compatibility change in BitThemeTypographyVariants by either restoring FontFamily, TextTransform, and Display for the H1–H6, Subtitle1/2, Body1/2, and Caption1/2 variant types, or explicitly provide a migration path and document the intentional breaking change in the release notes. Do not leave previously supported properties silently unavailable or discarded from persisted theme JSON.src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss (1)
1-1: 🎯 Functional Correctness | 🔴 Critical | ⚡ Quick winRestore
theme-variablesimport and drop.scssextensions.Replacing the
theme-variables.scssimport withfunctions.scsswill break SCSS compilation because this file heavily relies on tokens like$clr-pridefined intheme-variables. Additionally, as flagged in a previous review, importing files with the.scssextension violates stylelint'sscss/load-partial-extensionrule.Import both partials correctly without the extension.
🐛 Proposed fix
-@import "functions.scss"; +@import "theme-variables"; +@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 imports in bit-css.scss to include both theme-variables and functions, removing the .scss extensions from each import so the existing theme tokens remain available and SCSS load-partial-extension style rules pass.src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scss (1)
38-39: 🎯 Functional Correctness | 🟠 Major | ⚡ Quick winAdd fallbacks for dynamically bound disabled color variables.
As flagged in a previous review, CSS variables resolving to disabled variant tokens still lack fallback values. If a component is rendered without a color variant class, these variables remain undefined. This causes disabled components to unexpectedly inherit their parent's enabled colors. Add standard fallback tokens (e.g.,
#{$clr-fg-dis},#{$clr-bg-dis}) to all variant-boundvar()usages.
src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scss#L38-L39: Add#{$clr-fg-dis}as a fallback for--bit-acb-clr-dis-textin bothcolorand--bit-acb-clr-ico.src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss#L169-L171: Add fallbacks (#{$clr-fg-dis},#{$clr-bg-dis}) for disabled text, border, and background variables in.bit-btn-fil.bit-dis.src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss#L193-L195: Add fallbacks for disabled text and border in.bit-btn-otl.bit-dis.src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss#L217-L219: Add fallback for disabled text in.bit-btn-txt.bit-dis.src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scss#L28-L29: Add fallbacks for--bit-btg-clr-dis-textand--bit-btg-clr-disin.bit-btg.bit-dis.src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.scss#L131-L133: Add fallbacks for disabled text, border, and background variables in the disabled item state.src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss#L11-L21: Add fallbacks for--bit-pvt-clr-dis-textand--bit-pvt-clr-disin.bit-pvt.bit-dis.src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss#L246-L249: Add fallbacks for--bit-pvt-clr-dis-textand--bit-pvt-clr-disin.bit-pvti.bit-dis.src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scss#L8-L10: Add fallbacks for disabled text, background, and border variables in.bit-bdg.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/Buttons/ActionButton/BitActionButton.scss` around lines 38 - 39, Add standard disabled-token fallbacks to every listed variant-bound CSS variable usage: use #{$clr-fg-dis} for disabled text, #{$clr-bg-dis} for disabled backgrounds, and the appropriate disabled border token for borders. Apply the changes in BitActionButton.scss, BitButton.scss, BitButtonGroup.scss, BitPivot.scss, and BitBadge.scss at all specified sites, preserving the existing variable references and disabled-state selectors.
🤖 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/ToggleButton/BitToggleButton.scss`:
- Around line 23-27: Remove the stale outline-offset and literal outline
declarations from the &:focus-visible rule in BitToggleButton.scss, leaving
focus-ring(var(--bit-tgb-clr-focus)) as the sole focus indicator so the
per-variant focus token controls the ring without an additional base-colored
outline.
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss`:
- Around line 122-126: Update the NoBorder dropdown’s &:focus-visible rule to
pass var(--bit-drp-clr-focus) to focus-underline-ring, matching the bordered
variant and ensuring every color variant uses its themed focus color.
- Around line 65-71: Update the &:focus rule in BitDropdown.scss by inserting a
blank line before the inline double-slash comment, satisfying the
scss/double-slash-comment-empty-line-before Stylelint rule without changing the
focus styles.
In `@src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scss`:
- Around line 218-237: Update the background focus aliases
--bit-clr-bg-pri-focus, --bit-clr-bg-sec-focus, and --bit-clr-bg-ter-focus so
they default to visibly contrasting role or border colors rather than their
matching background variables. Preserve the existing focus alias structure for
the other color roles and ensure each background focus indicator remains
distinguishable when rendered over its corresponding surface.
---
Outside diff comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss`:
- Around line 4-13: Update the .bit-drp-nbd &:focus-visible underline-ring usage
to pass the dropdown’s configured focus color instead of relying on the mixin’s
primary-color default. Reuse the color variable established in .bit-drp,
preserving the existing styling for Secondary, Error, and other variants.
---
Duplicate comments:
In
`@src/BlazorUI/Bit.BlazorUI/Components/Buttons/ActionButton/BitActionButton.scss`:
- Around line 38-39: Add standard disabled-token fallbacks to every listed
variant-bound CSS variable usage: use #{$clr-fg-dis} for disabled text,
#{$clr-bg-dis} for disabled backgrounds, and the appropriate disabled border
token for borders. Apply the changes in BitActionButton.scss, BitButton.scss,
BitButtonGroup.scss, BitPivot.scss, and BitBadge.scss at all specified sites,
preserving the existing variable references and disabled-state selectors.
In `@src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss`:
- Line 1: Update the imports in bit-css.scss to include both theme-variables and
functions, removing the .scss extensions from each import so the existing theme
tokens remain available and SCSS load-partial-extension style rules pass.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cs`:
- Around line 5-13: Update BitExternalThemeAttach and BitExternalThemeDetach to
call IJSRuntime.InvokeVoidAsync instead of InvokeVoid, preserving the existing
JavaScript identifiers and arguments while returning the resulting ValueTask.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeTypography.cs`:
- Around line 27-44: Address the breaking API and JSON compatibility change in
BitThemeTypographyVariants by either restoring FontFamily, TextTransform, and
Display for the H1–H6, Subtitle1/2, Body1/2, and Caption1/2 variant types, or
explicitly provide a migration path and document the intentional breaking change
in the release notes. Do not leave previously supported properties silently
unavailable or discarded from persisted theme JSON.
🪄 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: 8cf8ef96-3eb5-4bdd-8eba-8cfc411f660d
📒 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: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor (1)
284-295: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick winInconsistent wrapper styling for
*Backgroundcolor variants in SearchBox demos.The
*Backgroundcolor variants (likePrimaryBackground) paint with light theme tokens that require a contrasting wrapper to be visible on the default page background. TheBitSearchBoxdemos miss thevar(--bit-clr-fg-sec)wrapper on enabled variants and inconsistently usevar(--bit-clr-bg-dis)on disabled variants, drifting from the layout convention established in theBitChoiceGroupdemos.
src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor#L284-L295: wrap the enabledPrimaryBackground,SecondaryBackground, andTertiaryBackgroundsample pairs (including<br />s) in<div style="background:var(--bit-clr-fg-sec);padding:1rem">.src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor#L354-L354: change the disabled wrapper's style frombackground:var(--bit-clr-bg-dis)tobackground:var(--bit-clr-fg-sec).src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cs#L265-L272: wrap the enabled*Backgroundsample code snippets in<div style=""background:var(--bit-clr-fg-sec);padding:1rem"">.src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cs#L317-L317: change the disabled wrapper's style in the snippet tobackground:var(--bit-clr-fg-sec).🤖 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/SearchBox/BitSearchBoxDemo.razor` around lines 284 - 295, Update the SearchBox demo’s enabled *Background sample pairs in BitSearchBoxDemo.razor (lines 284-295) and their snippets in BitSearchBoxDemo.razor.samples.cs (lines 265-272) by wrapping each complete sample group, including breaks, in the secondary-foreground padded wrapper. In BitSearchBoxDemo.razor (line 354) and BitSearchBoxDemo.razor.samples.cs (line 317), change the disabled wrapper background to the same secondary-foreground token.
♻️ Duplicate comments (3)
src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss (1)
67-69: 📐 Maintainability & Code Quality | 🟡 Minor | 💤 Low valueAdd an empty line before the inline comment.
This satisfies the
scss/double-slash-comment-empty-line-beforeStylelint rule.💡 Proposed fix
border-color: $clr-brd-dis; + // Suppress the focus ring while disabled, including the forced-colors outline. outline: 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` around lines 67 - 69, Add an empty line between the disabled border-color declaration and the inline comment in the relevant Dropdown SCSS rule, preserving the existing comment and outline declaration.Source: Linters/SAST tools
src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss (1)
1-1: 📐 Maintainability & Code Quality | 🟡 Minor | 💤 Low valueRemove
.scssextension from import.Using the
.scssextension in imports violates thescss/load-partial-extensionstylelint rule.🛠 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 functions.scss import in the stylesheet to omit the .scss extension, using the partial name while preserving the existing import target.Source: Linters/SAST tools
src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cs (1)
5-13: 🎯 Functional Correctness | 🔴 Critical | ⚡ Quick winConfirm
InvokeVoidresolves — likely still a compile error.
Microsoft.JSInterop.IJSRuntimehas noInvokeVoidmember; the standard async void-invoke extension isInvokeVoidAsync. This was flagged as a critical compile-time issue previously and, unlike other resolved threads in this PR, this comment carries no "✅ Addressed" marker — the code here is unchanged. It's possibleIJSRuntimeExtensions.cs(also part of this PR, not in this batch) defines a customInvokeVoidwrapper, but that needs confirming before treating this as resolved.🐛 Proposed fix (if no custom `InvokeVoid` extension exists)
internal static ValueTask BitExternalThemeAttach(this IJSRuntime js, string linkElementId, string href) { - return js.InvokeVoid("BitBlazorUI.ExternalTheme.attach", linkElementId, href); + return js.InvokeVoidAsync("BitBlazorUI.ExternalTheme.attach", linkElementId, href); } internal static ValueTask BitExternalThemeDetach(this IJSRuntime js, string linkElementId) { - return js.InvokeVoid("BitBlazorUI.ExternalTheme.detach", linkElementId); + return js.InvokeVoidAsync("BitBlazorUI.ExternalTheme.detach", linkElementId); }#!/bin/bash # Check whether a custom `InvokeVoid` extension on IJSRuntime exists anywhere in the repo. rg -nP 'static\s+ValueTask\s+InvokeVoid\s*\(' --type=cs rg -n 'InvokeVoid\(' src/BlazorUI/Bit.BlazorUI/Extensions/JsInterop/IJSRuntimeExtensions.cs 2>/dev/null cat -n src/BlazorUI/Bit.BlazorUI/Extensions/JsInterop/IJSRuntimeExtensions.cs 2>/dev/null | head -60🤖 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/BitExternalThemeJsExtensions.cs` around lines 5 - 13, Confirm whether a custom InvokeVoid extension exists for IJSRuntime; if not, update BitExternalThemeAttach and BitExternalThemeDetach to call the standard InvokeVoidAsync extension while preserving their existing JavaScript identifiers and arguments.
🧹 Nitpick comments (1)
src/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.razor.cs (1)
75-99: 🚀 Performance & Scalability | 🔵 Trivial | ⚡ Quick winPer-render JS interop call for
ScreenQuery-bound instances.
screenQuery is not nullforcesBitMediaQuerySetupto be invoked on everyOnAfterRenderAsync, even when the resolved breakpoints haven't changed (the JS side then just early-returns via its_resolvedQueriescache). For Blazor Server this still costs a network round trip per render for everyBitMediaQueryusingScreenQuery. Given this PR also introducesBitThemeNotifications.ThemeChanged, consider re-invoking setup only on parameter change or when a theme/layout change is observed, rather than unconditionally each render.🤖 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 75 - 99, Update the setup condition in BitMediaQuery’s OnAfterRenderAsync so ScreenQuery does not invoke BitMediaQuerySetup on every render. Track whether the effective query parameters changed or a BitThemeNotifications.ThemeChanged notification was observed, and only re-run setup for those cases while preserving custom Query precedence and existing JSDisconnectedException handling.
🤖 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/Utils/Theme/BitThemeManager.cs`:
- Around line 188-197: Update the registration exception handling around
BitThemeRegisterDotNetNotifier in the relevant theme manager method to also
catch OperationCanceledException alongside JSDisconnectedException. Preserve the
existing behavior of returning without propagating either exception, so public
theme methods retain their null-on-disconnect behavior and the retry flag
remains unchanged.
---
Outside diff comments:
In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor`:
- Around line 284-295: Update the SearchBox demo’s enabled *Background sample
pairs in BitSearchBoxDemo.razor (lines 284-295) and their snippets in
BitSearchBoxDemo.razor.samples.cs (lines 265-272) by wrapping each complete
sample group, including breaks, in the secondary-foreground padded wrapper. In
BitSearchBoxDemo.razor (line 354) and BitSearchBoxDemo.razor.samples.cs (line
317), change the disabled wrapper background to the same secondary-foreground
token.
---
Duplicate comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss`:
- Around line 67-69: Add an empty line between the disabled border-color
declaration and the inline comment in the relevant Dropdown SCSS rule,
preserving the existing comment and outline declaration.
In `@src/BlazorUI/Bit.BlazorUI/Styles/bit-css.scss`:
- Line 1: Update the functions.scss import in the stylesheet to omit the .scss
extension, using the partial name while preserving the existing import target.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cs`:
- Around line 5-13: Confirm whether a custom InvokeVoid extension exists for
IJSRuntime; if not, update BitExternalThemeAttach and BitExternalThemeDetach to
call the standard InvokeVoidAsync extension while preserving their existing
JavaScript identifiers and arguments.
---
Nitpick comments:
In
`@src/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.razor.cs`:
- Around line 75-99: Update the setup condition in BitMediaQuery’s
OnAfterRenderAsync so ScreenQuery does not invoke BitMediaQuerySetup on every
render. Track whether the effective query parameters changed or a
BitThemeNotifications.ThemeChanged notification was observed, and only re-run
setup for those cases while preserving custom Query precedence and existing
JSDisconnectedException handling.
🪄 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: 31a6f1d5-a5a0-484f-af6e-b2140e81449d
📒 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.
♻️ 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 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 partial import in BitGrid.scss to remove the .scss extension, leaving the existing relative import path otherwise unchanged.Source: Linters/SAST tools
src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scss (1)
8-8: 📐 Maintainability & Code Quality | 🟡 Minor | 💤 Low valueAdd fallbacks for disabled color variables.
Several components rely on variant-provided custom properties for disabled states (e.g.,
--bit-bdg-clr-dis-text,--bit-tag-clr-dis-text) without fallbacks. If a component instance lacks a color variant class, these disabled colors will resolve unpredictably. Add appropriate global disabled tokens (e.g.,#{$clr-fg-dis},#{$clr-bg-dis}) as fallbacks in thevar()expressions.
src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scss#L8-L8: Update tovar(--bit-bdg-clr-dis-text, #{$clr-fg-dis}).src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scss#L47-L49: Update tovar(--bit-tag-clr-dis-text, #{$clr-fg-dis})andvar(--bit-tag-clr-dis, #{$clr-bg-dis}).src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scss#L59-L60: Update tovar(--bit-tag-clr-dis-text, #{$clr-fg-dis})andvar(--bit-tag-clr-dis, #{$clr-bg-dis}).src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scss#L71-L71: Update tovar(--bit-tag-clr-dis-text, #{$clr-fg-dis}).src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss#L11-L11: Update tovar(--bit-pvt-clr-dis-text, #{$clr-fg-dis}).src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss#L17-L17: Update tovar(--bit-pvt-clr-dis-text, #{$clr-fg-dis}).src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss#L21-L21: Update tovar(--bit-pvt-clr-dis, #{$clr-bg-dis}).src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss#L246-L246: Update tovar(--bit-pvt-clr-dis-text, #{$clr-fg-dis}).src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss#L249-L249: Update tovar(--bit-pvt-clr-dis, #{$clr-bg-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/Notifications/Badge/BitBadge.scss` at line 8, Add global disabled-token fallbacks to each affected custom-property var() expression: in src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scss lines 8-8 use #{$clr-fg-dis}; in src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scss lines 47-49, 59-60, and 71-71 use #{$clr-fg-dis} for disabled text and #{$clr-bg-dis} for disabled backgrounds; in src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss lines 11-11, 17-17, 21-21, 246-246, and 249-249 use the corresponding #{$clr-fg-dis} or #{$clr-bg-dis} fallback.src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cs (1)
5-13:⚠️ Potential issue | 🔴 CriticalStill using
InvokeVoid; won't compile.IJSRuntimehas noInvokeVoidextension (the synchronousInvokeVoidlives onIJSInProcessRuntime), andInvokeVoidreturnsvoid, not the declaredValueTask. UseInvokeVoidAsync.🐛 Proposed fix
internal static ValueTask BitExternalThemeAttach(this IJSRuntime js, string linkElementId, string href) { - return js.InvokeVoid("BitBlazorUI.ExternalTheme.attach", linkElementId, href); + return js.InvokeVoidAsync("BitBlazorUI.ExternalTheme.attach", linkElementId, href); } internal static ValueTask BitExternalThemeDetach(this IJSRuntime js, string linkElementId) { - return js.InvokeVoid("BitBlazorUI.ExternalTheme.detach", linkElementId); + return js.InvokeVoidAsync("BitBlazorUI.ExternalTheme.detach", linkElementId); }#!/bin/bash # Confirm no InvokeVoid usages remain and InvokeVoidAsync is the standard extension. rg -nP '\bInvokeVoid\s*\(' src/BlazorUI🤖 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/BitExternalThemeJsExtensions.cs` around lines 5 - 13, Update BitExternalThemeAttach and BitExternalThemeDetach to call IJSRuntime’s InvokeVoidAsync extension instead of InvokeVoid, preserving their existing JavaScript identifiers and arguments so the declared ValueTask return types compile correctly.
🧹 Nitpick comments (3)
src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeLayout.cs (1)
11-11: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low valueAdd XML doc for
Breakpointsfor consistency.
DirectionandDensityScaleboth have<summary>docs;Breakpointshas none, which is inconsistent for a public API surface.🤖 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/BitThemeLayout.cs` at line 11, Add an XML summary documentation comment for the public Breakpoints property in BitThemeLayout, matching the existing documentation style used by Direction and DensityScale and accurately describing the property’s purpose.src/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.razor.cs (1)
83-98: 🚀 Performance & Scalability | 🔵 Trivial | 🏗️ Heavy liftJS interop invoked on every render when using
ScreenQuery.
screenQuery is not nullforcesBitMediaQuerySetupto be awaited on everyOnAfterRenderAsync, not just when the resolved query actually changes (the JS side's cache only avoids re-creating the listener, not the interop round-trip itself). For Blazor Server this is a SignalR round-trip on every re-render of any component usingScreenQuery.Consider subscribing to theme/breakpoint-changed notifications (now available via
BitThemeNotifications/BitThemeManager, added elsewhere in this PR) instead of re-invoking JS setup unconditionally on every render.🤖 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 - 98, Update the BitMediaQuery OnAfterRenderAsync logic around effectiveKey and BitMediaQuerySetup so ScreenQuery does not trigger JS interop on every render. Subscribe to the available BitThemeNotifications/BitThemeManager breakpoint-change notifications and rerun setup only when the resolved predefined query changes, while preserving the existing key comparison for custom queries and disposing the subscription appropriately.src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cs (1)
44-49: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winDocument the new
ObjectDisposedExceptioncontract on public methods.
EnsureJsNotifierRegisteredAsyncnow fails fast withObjectDisposedExceptionafterDisposeAsync()(Line 171), but every public method that funnels through it (GetCurrentThemeAsync,SetThemeAsync,ToggleDarkLightAsync,IsSystemInDarkModeAsync,GetCurrentPersistedThemeAsync,ApplyBitThemeAsync,ClearBitThemeOverridesAsync) only documents the "returns null when JS interop is unavailable" case, not that calling any of them post-dispose now throws.♻️ Example doc update
/// <summary>Returns the active <c>bit-theme</c> name from the document element.</summary> + /// <exception cref="ObjectDisposedException">Thrown if called after <see cref="DisposeAsync"/>.</exception> public async ValueTask<string?> GetCurrentThemeAsync()Also applies to: 68-72, 101-105, 128-132, 144-148, 166-171
🤖 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 44 - 49, Update the XML documentation for all public methods that call EnsureJsNotifierRegisteredAsync—GetCurrentThemeAsync, SetThemeAsync, ToggleDarkLightAsync, IsSystemInDarkModeAsync, GetCurrentPersistedThemeAsync, ApplyBitThemeAsync, and ClearBitThemeOverridesAsync—to document that they throw ObjectDisposedException after DisposeAsync(). Preserve their existing documentation for JS interop-unavailable return behavior.
🤖 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.
Duplicate comments:
In `@src/BlazorUI/Bit.BlazorUI/Components/Layouts/Grid/BitGrid.scss`:
- Line 1: Update the partial import in BitGrid.scss to remove the .scss
extension, leaving the existing relative import path otherwise unchanged.
In `@src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scss`:
- Line 8: Add global disabled-token fallbacks to each affected custom-property
var() expression: in
src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scss lines 8-8
use #{$clr-fg-dis}; in
src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.scss lines 47-49,
59-60, and 71-71 use #{$clr-fg-dis} for disabled text and #{$clr-bg-dis} for
disabled backgrounds; in
src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss lines 11-11,
17-17, 21-21, 246-246, and 249-249 use the corresponding #{$clr-fg-dis} or
#{$clr-bg-dis} fallback.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitExternalThemeJsExtensions.cs`:
- Around line 5-13: Update BitExternalThemeAttach and BitExternalThemeDetach to
call IJSRuntime’s InvokeVoidAsync extension instead of InvokeVoid, preserving
their existing JavaScript identifiers and arguments so the declared ValueTask
return types compile correctly.
---
Nitpick comments:
In
`@src/BlazorUI/Bit.BlazorUI/Components/Utilities/MediaQuery/BitMediaQuery.razor.cs`:
- Around line 83-98: Update the BitMediaQuery OnAfterRenderAsync logic around
effectiveKey and BitMediaQuerySetup so ScreenQuery does not trigger JS interop
on every render. Subscribe to the available
BitThemeNotifications/BitThemeManager breakpoint-change notifications and rerun
setup only when the resolved predefined query changes, while preserving the
existing key comparison for custom queries and disposing the subscription
appropriately.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitTheme/BitThemeLayout.cs`:
- Line 11: Add an XML summary documentation comment for the public Breakpoints
property in BitThemeLayout, matching the existing documentation style used by
Direction and DensityScale and accurately describing the property’s purpose.
In `@src/BlazorUI/Bit.BlazorUI/Utils/Theme/BitThemeManager.cs`:
- Around line 44-49: Update the XML documentation for all public methods that
call EnsureJsNotifierRegisteredAsync—GetCurrentThemeAsync, SetThemeAsync,
ToggleDarkLightAsync, IsSystemInDarkModeAsync, GetCurrentPersistedThemeAsync,
ApplyBitThemeAsync, and ClearBitThemeOverridesAsync—to document that they throw
ObjectDisposedException after DisposeAsync(). Preserve their existing
documentation for JS interop-unavailable return behavior.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: 0bc110a3-2e53-4d4a-8a65-a168ab0cadd3
📒 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 |
…into 12320-blazorui-theme-improvements-ii
Member
Author
|
@coderabbitai full-review |
|
✅ Action performedFull review finished. |
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-visible) and underline rings across controls, with improved forced-colors/high-contrast behavior.