fix(RangeSlider): vertically center slider in its container

[Abdellox]

Fixes #1202

The root wrapper used flex without items-center, causing the range input to sit at the bottom of the flex container instead of being vertically centered. This made it impossible to align the RangeSlider with other components using flex + items-center.

Added items-center to the root base Tailwind class to fix vertical alignment.

Before: Slider touches the bottom of its container box
After: Slider is vertically centered — works correctly with sibling flex items

Summary by CodeRabbit

• Style
  • Improved range slider layout by vertically centering its content within the slider container.

[changeset-bot]

⚠️ No Changeset found

Latest commit: b0f201a

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[vercel]

@Abdellox is attempting to deploy a commit to the Bergside Team on Vercel.

A member of the Team first needs to authorize it.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Team

Run ID: 5040d962-895b-484e-a3c8-3c85dbdf9aec

📥 Commits

Reviewing files that changed from the base of the PR and between 85319bd and b0f201a.

📒 Files selected for processing (1)

• packages/ui/src/components/RangeSlider/theme.ts

Included review availability: Your plan provides up to 8 included reviews per hour; 6 remain after this review.

---

📝 Walkthrough

Walkthrough

The range slider root theme now includes items-center with flex. This vertically centers the slider contents within the root container.

Changes

Range slider alignment

Layer / File(s)	Summary
Center range slider contents packages/ui/src/components/RangeSlider/theme.ts	The root.base class now includes items-center alongside flex.

Estimated code review effort: 1 (Trivial) | ~2 minutes

Merge Risk: ⚪ Minimal · up to b0f20

The RangeSlider root now vertically centers its contents, improving alignment with sibling controls without changing component APIs or behavior beyond layout.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly and concisely describes the main change: vertically centering the RangeSlider within its container.
Linked Issues check	✅ Passed	The change adds items-center to the RangeSlider root wrapper. This directly addresses issue #1202 by vertically centering the input and improving alignment in flex layouts.
Out of Scope Changes check	✅ Passed	The pull request contains one focused class change in the RangeSlider theme. The change is directly related to issue #1202 and the stated objectives.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 1…

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

Warning

Some tools did not complete. Review the errors below.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

packages/ui/src/components/RangeSlider/theme.ts

Oops! Something went wrong! :(

ESLint: 8.57.0

Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: Failed to load plugin 'tailwindcss' declared in '--config': Package subpath './resolveConfig' is not defined by "exports" in /.eslint-tmp/node_modules/tailwindcss/package.json
Referenced from: /packages/ui/.eslintrc.cjs
at exportsNotFound (node:internal/modules/esm/resolve:310:10)
at packageExportsResolve (node:internal/modules/esm/resolve:658:9)
at resolveExports (node:internal/modules/cjs/loader:685:36)
at Module._findPath (node:internal/modules/cjs/loader:752:31)
at Module._resolveFilename (node:internal/modules/cjs/loader:1461:27)
at wrapResolveFilename (node:internal/modules/cjs/loader:1049:27)
at defaultResolveImplForCJSLoading (node:internal/modules/cjs/loader:1073:10)
at defaultResolve (node:internal/modules/cjs/loader:1124:20)
at nextStep (node:internal/modules/customization_hooks:189:26)
at resolve (file:///.eslint-tmp/.coderabbit-resolver.mjs:11:14)

---

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.}