refactor: use VariantProps instead of manually defining props

[paanSinghCoder]

Description

refactor: use VariantProps from cva instead of manually defining.

Type of Change

• Bug fix (non-breaking change that fixes an issue)
• New feature (non-breaking change that adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• Documentation update
• Refactor (no functional changes, no bug fixes just code improvements)
• Chore (changes to the build process or auxiliary tools and libraries such as documentation generation)
• Style (changes that do not affect the meaning of the code (white-space, formatting, etc))
• Test (adding missing tests or correcting existing tests)
• Improvement (Improvements to existing code)
• Other (please specify)

How Has This Been Tested?

[Describe the tests that you ran to verify your changes]

Checklist:

• My code follows the style guidelines of this project
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation (.mdx files)
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works

Screenshots (if appropriate):

[Add screenshots here]

Related Issues

[Link any related issues here using #issue-number]

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
apsara	Ready	Preview, Comment	Apr 7, 2026 8:28am

[coderabbitai]

📝 Walkthrough

Walkthrough

Three component prop type definitions were refactored to derive variant types directly from their respective class-variance-authority (CVA) definitions using VariantProps. The Separator component's SeparatorProps changed from an explicit interface to a type combining SeparatorPrimitive.Props and CVA variants. The Tabs component's TabsRootProps now derives variant and size from the CVA definition, removing separately maintained type unions. The TextArea component's TextAreaProps was extended to include CVA variant props, particularly the error variant. No functional or control flow changes were introduced; the updates align prop type sources with their CVA definitions.

Possibly related issues

• [Separator] Support ref as prop and forward Base UI render props #634: This PR's refactoring of Separator component prop types to derive from CVA definitions relates to modifications of the Separator component's prop surface, which could impact how ref, render, or className props are surfaced or forwarded.

Suggested reviewers

• rohanchkrabrty
• rsbh

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately reflects the main refactoring change: replacing manually defined component props with VariantProps from CVA across multiple components.
Description check	✅ Passed	The description clearly states the refactoring intent to use VariantProps from CVA instead of manually defining props, which aligns with the actual changeset.

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

---

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]

🧹 Nitpick comments (1)

packages/raystack/components/text-area/text-area.tsx (1)

18-25: Redundant error property declaration.

The error?: boolean on line 25 is redundant since VariantProps<typeof textArea> already derives the error variant type from the CVA definition. This partially defeats the purpose of using VariantProps — if the CVA variant changes, you'd still need to update the manual declaration.

Consider removing the explicit error declaration to fully leverage VariantProps:

♻️ Suggested refactor

 export interface TextAreaProps
   extends ComponentProps<'textarea'>,
     VariantProps<typeof textArea> {
   label?: string;
   required?: boolean;
   infoTooltip?: string;
   helperText?: string;
-  error?: boolean;
   disabled?: boolean;
   width?: string | number;
   value?: string;
   onChange?: (event: ChangeEvent<HTMLTextAreaElement>) => void;
 }

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@packages/raystack/components/text-area/text-area.tsx` around lines 18 - 25,
Remove the redundant manual error?: boolean declaration from the TextAreaProps
interface so it relies on VariantProps<typeof textArea> to provide the error
variant; update the TextAreaProps definition (interface TextAreaProps extends
ComponentProps<'textarea'>, VariantProps<typeof textArea>) by deleting the
explicit error property and ensure any usages expect the variant-provided error
prop instead (references: TextAreaProps, VariantProps, textArea, error).

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Nitpick comments:
In `@packages/raystack/components/text-area/text-area.tsx`:
- Around line 18-25: Remove the redundant manual error?: boolean declaration
from the TextAreaProps interface so it relies on VariantProps<typeof textArea>
to provide the error variant; update the TextAreaProps definition (interface
TextAreaProps extends ComponentProps<'textarea'>, VariantProps<typeof textArea>)
by deleting the explicit error property and ensure any usages expect the
variant-provided error prop instead (references: TextAreaProps, VariantProps,
textArea, error).

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: c77b028d-fdef-44c0-8fc1-99759e1b60ba

📥 Commits

Reviewing files that changed from the base of the PR and between 34197a6 and a362948.

📒 Files selected for processing (3)

• packages/raystack/components/separator/separator.tsx
• packages/raystack/components/tabs/tabs.tsx
• packages/raystack/components/text-area/text-area.tsx