style(text-input): correct background-color of TextInput component

[agetbase]

Related Issues

Description of Changes

Updated the TextInput component's background color token to align with Figma specifications.

https://www.figma.com/design/EvBRPYcF6lOTpFtQRq3s9G/Vapor-Design-System--Community-?node-id=33702-24537&t=0ejIqwMscwWuE3Jh-1

Changes:

• Changed backgroundColor from vars.color.background.overlay[100] to vars.color.background.canvas[100]

This change ensures visual consistency between the design system and the implemented component.

Screenshots

Before: vars.color.background.overlay[100]
After: vars.color.background.canvas[100]

Checklist

Before submitting the PR, please make sure you have checked all of the following items.

• The PR title follows the Conventional Commits convention. (e.g., fix(TextInput): update background color to match Figma specs)
• I have added tests for my changes.
• I have updated the Storybook or relevant documentation.
• I have added a changeset for this change. (e.g., for any changes that affect users, such as component prop changes or new features).
• I have performed a self-code review.
• I have followed the project's coding conventions and component patterns.

[changeset-bot]

🦋 Changeset detected

Latest commit: da4140d

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages

Name	Type
@vapor-ui/core	Patch
figma-plugin	Patch
website	Patch

Not sure what this means? Click here to learn what changesets are.

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

[vercel]

@agetbase is attempting to deploy a commit to the goorm Team on Vercel.

A member of the Team first needs to authorize it.

[gemini-code-assist]

Summary of Changes

Hello @agetbase, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request addresses a visual inconsistency in the TextInput component by updating its background color token. The change ensures that the component's appearance accurately reflects the design system's specifications, enhancing overall UI consistency.

Highlights

• Background Color Correction: The TextInput component's background color has been updated to align with Figma specifications.
• Color Token Change: Specifically, the backgroundColor property was changed from vars.color.background.overlay[100] to vars.color.background.canvas[100].

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

TextInput 컴포넌트의 배경색 토큰을 Figma 명세에 맞게 수정하는 변경 사항을 확인했습니다. background.overlay[100]에서 background.canvas[100]으로 변경하여 다크 모드에서의 배경색을 일관성 있게 조정한 것으로 보입니다. 코드 변경 사항은 명확하며, 프로젝트의 스타일링 컨벤션을 잘 따르고 있습니다. 특별한 문제가 발견되지 않았습니다.

[noahchoii]

Thank you for your contribution!

[vercel]

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

Project	Deployment	Preview	Comments	Updated (UTC)
vapor-ui	Ready	Preview	Comment	Dec 11, 2025 7:16am

[MaxLee-dev]

👍

[MaxLee-dev]

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

Project Deployment Preview Comments Updated (UTC)
vapor-ui Error Dec 10, 2025 1:52am

@agetbase The current documentation site version is the RCE vulnerable version specified in next, causing the Vercel preview deployment to fail. A pull request fixing this has been merged into main. Please update to the latest main branch.

[noahchoii]

Thank you for your Contribution!