fix(slider, scroll-area): use correct data-orientation attribute selectors

[sunnypatell]

Summary

• replaced data-horizontal: with data-[orientation=horizontal]:
• replaced data-vertical: with data-[orientation=vertical]:

Fixes #9196

Problem

the components output data-orientation="horizontal" (a key-value attribute), but the old selectors data-horizontal: expected a boolean attribute like data-horizontal to be present.

this caused:

• scrollbars not to display in scroll-area
• slider orientation styles to fail

Changes

slider.tsx (base + radix)

- data-horizontal:w-full data-vertical:h-full
+ data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full

style-*.css (all 5 themes)

- @apply data-horizontal:h-2.5 data-vertical:w-2.5 ...
+ @apply data-[orientation=horizontal]:h-2.5 data-[orientation=vertical]:w-2.5 ...

Test plan

• scroll-area displays scrollbars when content overflows
• slider orientation (horizontal/vertical) styles work correctly

[vercel]

@sunnypatell is attempting to deploy a commit to the shadcn-pro Team on Vercel.

A member of the Team first needs to authorize it.

[Copilot]

Pull request overview

This PR fixes a bug where Tailwind data attribute selectors for scroll-area and slider components were using an incorrect syntax that prevented styles from being applied. The components output data-orientation="horizontal" or data-orientation="vertical" as key-value attributes, but the old selectors expected boolean attributes.

Changes:

• Updated data attribute selectors from data-horizontal: and data-vertical: to data-[orientation=horizontal]: and data-[orientation=vertical]: in all 5 theme CSS files
• Updated slider components in both base and radix implementations to use the correct data attribute selector syntax

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
apps/v4/registry/styles/style-vega.css	Fixed scroll-area-scrollbar and slider data attribute selectors for vega theme
apps/v4/registry/styles/style-nova.css	Fixed scroll-area-scrollbar and slider data attribute selectors for nova theme
apps/v4/registry/styles/style-mira.css	Fixed scroll-area-scrollbar and slider data attribute selectors for mira theme
apps/v4/registry/styles/style-maia.css	Fixed scroll-area-scrollbar and slider data attribute selectors for maia theme
apps/v4/registry/styles/style-lyra.css	Fixed scroll-area-scrollbar and slider data attribute selectors for lyra theme
apps/v4/registry/bases/radix/ui/slider.tsx	Updated slider component data attribute selectors to match correct syntax in radix implementation
apps/v4/registry/bases/base/ui/slider.tsx	Updated slider component data attribute selectors to match correct syntax in base implementation

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[oxc]

This is actually now handled by the new custom variants in tailwind.css:

ui/packages/shadcn/src/tailwind.css

Lines 76 to 86 in f1b7102

	@custom-variant data-horizontal {
	&:where([data-orientation="horizontal"]) {
	@slot;
	}
	}
	@custom-variant data-vertical {
	&:where([data-orientation="vertical"]) {
	@slot;
	}
	}

A heads up would have been nice 😂