Feature/CDP-157-AuthInputField #39
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
๐ก Codex Review
Here are some automated review suggestions for this pull request.
โน๏ธ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with ๐.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| <input | ||
| type={type} | ||
| data-slot="input" | ||
| className={cn( | ||
| // ํฌ๊ธฐ/๋ ์ด์์ | ||
| "h-12 w-full min-w-0 rounded-md px-3 py-2 text-sm outline-none transition-colors", | ||
| // ๊ธฐ๋ณธ ํ ์คํธ/๋ฐฐ๊ฒฝ | ||
| "bg-white text-[#111827]", | ||
| // ๊ธฐ๋ณธ ํ ๋๋ฆฌ(1px, ํ์) | ||
| "border border-[var(--color-gray-300)]", | ||
| // ํ๋ ์ด์คํ๋ | ||
| "placeholder:text-[#737373]", | ||
| // โ ํฌ์ปค์ค(ํ์ฑํ): ํ ๋๋ฆฌ ๋๊ปโ(2px) + ์์ #111827 | ||
| "focus-visible:border-2 focus-visible:border-[#111827]", | ||
| // ์๋ฌ(์ ๊ทผ์ฑ): aria-invalid=true โ ํ ๋๋ฆฌ #dc2626 | ||
| "aria-invalid:border-[#dc2626]", | ||
| // ๋นํ์ฑ | ||
| "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50", | ||
| // file input ๊ธฐ๋ณธ๊ฐ(ํ์ ์) | ||
| "file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground", | ||
| className, | ||
| )} | ||
| {...props} | ||
| ref={ref} | ||
| onFocus={handleFocus} | ||
| onBlur={handleBlur} | ||
| className={cn(authInputVariants({ status: currentStatus }), className)} | ||
| aria-invalid={currentStatus === "error" ? "true" : "false"} | ||
| data-invalid={currentStatus === "error" ? "true" : "false"} | ||
| {...rest} |
There was a problem hiding this comment.
The new auth input clears its error state in handleFocus/handleBlur, but the JSX spreads ...rest after wiring those handlers. Any consumer that passes its own onFocus or onBlur prop will overwrite the internal handlers, so the input never resets its status and the wrapped callbacks (rest.onFocus/rest.onBlur) are never invoked. This makes the error-clearing behaviour unreliable in typical form usage where custom focus handlers are common. Consider spreading rest before attaching the internal handlers or composing the handlers so both run.
Useful? React with ๐ย / ๐.
๐ Pull Request
๐ PR ์ ํ
๐ ๋ณ๊ฒฝ ์ฌํญ
๊ฐ ํ์ด์ง์ ์๋ metadata๋ฅผ layout์ผ๋ก ์ฎ๊ฒผ์
Auth Input Field ๋ก๊ทธ์ธ & ํ์๊ฐ์ input์ ์ถ๊ฐ ์ํด
๐ธ ์คํฌ๋ฆฐ์ท
๐ง ๊ด๋ จ ์ด์
๐ ๏ธ ์ต์ข ๋ฐฐํฌ ์ ๊ฒ ๋ฆฌ์คํธ
โ ์ต์ข ๋ฐฐํฌ ์ ๊ฒ ๊ฒฐ๊ณผ