Add new Icon parameters to BitCarousel (#12098)

[msynk]

closes #12098

Summary by CodeRabbit

• New Features

  • Carousel navigation now supports external icon libraries and a richer icon configuration (external icon objects plus built-in names).

• Bug Fixes

  • Fixed RTL and icon-rendering issues for carousel controls.

• Documentation

  • Updated demo with examples showing external icon library usage (FontAwesome, Bootstrap Icons).

• Chores

  • Removed stray hidden characters and corrected stylesheet import syntax.

[coderabbitai]

Walkthrough

Refactors BitCarousel to support external icons via BitIconInfo (with parallel built‑in name properties), updates Razor rendering to use icon CSS classes, removes an RTL flip helper in SCSS, and adds demo examples showing external icon usage.

Changes

Cohort / File(s)	Summary
BitCarousel Razor & logic src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.razor, src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.razor.cs	Replaced string-based GoLeftIcon/GoRightIcon with BitIconInfo? GoLeftIcon/GoRightIcon and added string? GoLeftIconName/GoRightIconName. Razor now builds local goLeftIcon/goRightIcon and uses GetCssClasses() for button icons. Removed stray BOM.
Carousel styles src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.scss	Removed leading BOM from import line and deleted .bit-csl-rbi RTL-flip class (removed transform: scaleX(-1)).
Demo pages and demo code-behind src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Carousel/BitCarouselDemo.razor, .../BitCarouselDemo.razor.cs	Fixed BOM in page directive, replaced an RTL demo with an "External Icons" example demonstrating Font Awesome and Bootstrap Icons via BitIconInfo. Added demo parameters (GoLeftIcon/GoLeftIconName/GoRightIcon/GoRightIconName) and extended documentation/examples.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

🐰 I hopped in to tweak the slide,

Icons now travel far and wide,
BitIconInfo leads the tune,
Chevrons swivel left and right in tune,
Hooray — the carousel’s more spry! 🥕✨

🚥 Pre-merge checks | ✅ 6

✅ Passed checks (6 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately summarizes the primary change: adding new Icon parameters to BitCarousel, which matches the main objective of implementing the new Icon feature.
Linked Issues check	✅ Passed	The pull request successfully implements the new Icon feature for BitCarousel by adding BitIconInfo-based parameters (GoLeftIcon, GoRightIcon, and their corresponding name properties) to support external icons, directly addressing issue #12098.
Out of Scope Changes check	✅ Passed	All changes are directly related to implementing the new Icon parameters for BitCarousel. Minor formatting fixes (BOM character removal) are incidental improvements aligned with the scope.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Merge Conflict Detection	✅ Passed	✅ No merge conflicts detected when merging into develop

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 1

🤖 Fix all issues with AI agents

In `@src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.razor`:
- Line 38: Remove the orphaned "bit-csl-rbi" CSS class from the class attribute
in BitCarousel.razor; update the class string that currently reads
class="bit-csl-rbi `@goRightIcon`?.GetCssClasses() `@Classes`?.GoRightButtonIcon" to
omit "bit-csl-rbi" so only `@goRightIcon`?.GetCssClasses() and
`@Classes`?.GoRightButtonIcon remain (preserve existing spacing/concatenation
logic and do not add new classes).

🧹 Nitpick comments (2)

src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.scss (1)

1-1: Remove the .scss extension from the @import path.

Stylelint flags scss/load-partial-extension: the @import should omit the file extension for SCSS partials.

Proposed fix

-@import "../../../Styles/functions.scss";
+@import "../../../Styles/functions";

src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.razor (1)

25-26: Consider adding brief comments explaining the non-obvious default icon assignments.

The naming is counterintuitive: GoLeftIcon defaults to "ChevronRight" and GoRightIcon defaults to "ChevronRight bit-ico-r180". This is correct because "GoLeft" means "navigate to left items" (the button sits on the right side), but it will confuse future maintainers without a quick note.

[msynk]

@coderabbitai review

[coderabbitai]

✅ Actions performed

Review triggered.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

[sonarqubecloud]

Quality Gate failed

Failed conditions
23.3% Duplication on New Code (required ≤ 3%)

See analysis details on SonarQube Cloud

[coderabbitai]

Actionable comments posted: 2

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Carousel/BitCarouselDemo.razor.cs (1)

137-137: ⚠️ Potential issue | 🟡 Minor

Copy-paste error: Title says "BitTimelineClassStyles" instead of "BitCarouselClassStyles".

-            Title = "BitTimelineClassStyles",
+            Title = "BitCarouselClassStyles",

🤖 Fix all issues with AI agents

In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Carousel/BitCarouselDemo.razor`:
- Around line 209-210: The GoLeftIcon and GoRightIcon values are reversed in the
BitCarousel examples; update the two carousel usages in BitCarouselDemo.razor so
GoLeftIcon uses a left-pointing icon and GoRightIcon uses a right-pointing icon
(swap the arguments passed to BitIconInfo.Fa and any BitIconInfo.Bi calls used
in those same examples). Locate the carousel components in BitCarouselDemo.razor
that set the GoLeftIcon and GoRightIcon properties and swap their assigned icon
identifiers so GoLeftIcon references the left-arrow icon and GoRightIcon
references the right-arrow icon in both carousel examples.

In
`@src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Carousel/BitCarouselDemo.razor.cs`:
- Around line 596-650: The example7RazorCode string has the left/right icons
swapped: GoLeftIcon is set to right-arrow icons and GoRightIcon to left-arrow
icons; update the two occurrences inside example7RazorCode so GoLeftIcon uses
the left-arrow icon names and GoRightIcon uses the right-arrow icon names (match
the corrected mapping used in the .razor file) to keep BitIconInfo.Fa(...) and
BitIconInfo.Bi(...) assignments consistent.

🧹 Nitpick comments (1)

src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Carousel/BitCarouselDemo.razor (1)

204-204: Inline <link> stylesheet tags in component body.

Loading external stylesheets via <link> tags in the component body (rather than in the <head>) works in browsers but may cause a flash of unstyled content and is not standard practice. Consider noting this in the demo or moving the links to the <head> section or using Blazor's HeadContent component.

Also applies to: 235-235