rohit/probo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix invalid input

Browse Source 
Signed-off-by: Émile Ré <emile@getprobo.com>
This commit is contained in:
Émile Ré
2026-04-27 15:09:57 +04:00
parent 84632fe795
commit ff2c7b9cce
1 changed files with 5 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
packages/ui/src/Atoms/Input/Input.tsx
View File

@@ -29,11 +29,12 @@ export const input = tv({
base: "w-full disabled:bg-transparent", base: "w-full disabled:bg-transparent",
variants: { variants: {
invalid: { invalid: {
true: "border-border-danger", true: "border-border-danger hover:border-e-border-danger",
false: "border-border-mid hover:border-border-strong",
}, },
variant: { variant: {
bordered: bordered:
"py-[6px] bg-secondary border border-border-mid rounded-[10px] hover:border-border-strong text-sm px-3 text-txt-primary", "py-[6px] bg-secondary border rounded-[10px] text-sm px-3 text-txt-primary",
ghost: "text-base text-txt-secondary outline-none", ghost: "text-base text-txt-secondary outline-none",
title: "text-2xl font-semibold text-txt-primary outline-none", title: "text-2xl font-semibold text-txt-primary outline-none",
}, },
@@ -56,6 +57,7 @@ export function Input({
<div <div
className={input({ className={input({
className: "flex items-center gap-2", className: "flex items-center gap-2",
invalid,
})} })}
data-focus={focus} data-focus={focus}
> >
@@ -84,7 +86,7 @@ export function Input({
<input <input
{...props} {...props}
aria-invalid={invalid} aria-invalid={invalid}
className={input(props)} className={input({ invalid, ...props })}
onChange={(e) => { onChange={(e) => {
onValueChange?.(e.currentTarget.value); onValueChange?.(e.currentTarget.value);
props.onChange?.(e); props.onChange?.(e);