fix (label): label weight and padding for InputField and Label components

[paanSinghCoder]

Description

fix (InputField): consistent container gap between label, input-field and helperText
fix (Label): medium weight to match design

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?

Manual

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

Summary by CodeRabbit

• Style
  • Adjusted container spacing and padding in input field components for improved layout.
  • Increased font weight for label text across all size variants for enhanced visual emphasis.

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
apsara	Ready	Preview, Comment	Mar 16, 2026 7:43am

[coderabbitai]

📝 Walkthrough

Walkthrough

These changes adjust spacing, typography, and padding properties across two CSS component modules. Container gaps are increased, label font weights are enhanced, and helper text padding is removed for refined visual spacing.

Changes

Cohort / File(s)	Summary
Input Field Styling packages/raystack/components/input-field/input-field.module.css	Container gap increased, font-style added to label, helper-text top padding removed, labelContainer bottom padding removed.
Label Styling packages/raystack/components/label/label.module.css	Added medium font-weight to label size variants (.label-small, .label-medium, .label-large).

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~5 minutes

Poem

Hopping through pixels with spacing so keen, 🐰
Labels grow bolder, the finest we've seen,
Gaps widen gracefully, padding retreats,
Our CSS burrow now perfectly meets! ✨

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 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 main changes: fixing label weight and padding in both InputField and Label components, which aligns with the actual modifications made to the CSS files.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

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

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch fix/input-label-styling

📝 Coding Plan

• Generate coding plan for human review comments

---

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]

Caution

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

⚠️ Outside diff range comments (1)

packages/raystack/components/input-field/input-field.module.css (1)

1-1: ⚠️ Potential issue | 🟠 Major

Review text-area.module.css for spacing and label styling alignment.

The warning comment is valid: measurable inconsistencies exist between the files. Compare:

• Container gap: input-field uses var(--rs-space-2) while text-area uses var(--rs-space-1)
• Label container: text-area includes padding-bottom: var(--rs-space-2), input-field does not

Verify these spacing differences are intentional; if the PR changes intent to bring both components closer to a unified spacing model, text-area.module.css should be updated for consistency.

🤖 Prompt for AI Agents

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

In `@packages/raystack/components/input-field/input-field.module.css` at line 1,
The spacing between input-field and text-area is inconsistent:
input-field.module.css uses gap: var(--rs-space-2) and lacks label container
padding, while text-area.module.css uses gap: var(--rs-space-1) and includes
padding-bottom: var(--rs-space-2). Decide on the unified spacing model and make
matching changes — either update text-area.module.css to use gap:
var(--rs-space-2) and remove or align padding-bottom on the label container, or
update input-field.module.css to use var(--rs-space-1) and add padding-bottom:
var(--rs-space-2) to its label container — ensuring both files use the same gap
variable and the label container padding is consistent.

🤖 Prompt for all review comments with AI agents

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

Outside diff comments:
In `@packages/raystack/components/input-field/input-field.module.css`:
- Line 1: The spacing between input-field and text-area is inconsistent:
input-field.module.css uses gap: var(--rs-space-2) and lacks label container
padding, while text-area.module.css uses gap: var(--rs-space-1) and includes
padding-bottom: var(--rs-space-2). Decide on the unified spacing model and make
matching changes — either update text-area.module.css to use gap:
var(--rs-space-2) and remove or align padding-bottom on the label container, or
update input-field.module.css to use var(--rs-space-1) and add padding-bottom:
var(--rs-space-2) to its label container — ensuring both files use the same gap
variable and the label container padding is consistent.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: d6a37ec4-c28a-4d8f-8ee0-c32858de5324

📥 Commits

Reviewing files that changed from the base of the PR and between 600819e and f1627ec.

📒 Files selected for processing (2)

• packages/raystack/components/input-field/input-field.module.css
• packages/raystack/components/label/label.module.css