feat: update input errors ui

Author: iatopilskii

packages/ui/src/components/form-error-message.tsx

@@ -29,7 +29,7 @@ export function FormErrorMessage({ children, theme, className }: FormErrorMessag
 
   return (
     <div className={cn(textClass, className)} role={role} aria-live={ariaLive}>
-      <Text as="p" size={0} className="font-light leading-none text-inherit">
+      <Text as="p" size={2} className="text-inherit">
         {children}
       </Text>
     </div>

packages/ui/src/components/input.tsx

@@ -67,7 +67,7 @@ const Input = forwardRef<HTMLInputElement, InputProps>(
         )}
         <BaseInput id={id} ref={ref} theme={error ? 'danger' : theme} disabled={disabled} {...props} />
         {error && (
-          <FormErrorMessage className="mt-1" theme={error.theme}>
+          <FormErrorMessage className={cn(caption ? 'mt-1' : 'absolute top-full translate-y-1')} theme={error.theme}>
             {error.message}
           </FormErrorMessage>
         )}

packages/ui/src/components/select.tsx

@@ -44,7 +44,7 @@ const Select: FC<SelectProps> = ({
     </SelectTrigger>
     {children}
     {error && (
-      <FormErrorMessage className="mt-1" theme={error.theme}>
+      <FormErrorMessage className={cn(caption ? 'mt-1' : 'absolute top-full translate-y-1')} theme={error.theme}>
         {error.message}
       </FormErrorMessage>
     )}

packages/ui/src/components/textarea.tsx

@@ -41,7 +41,7 @@ const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
           {...props}
         />
         {error && (
-          <FormErrorMessage className="mt-1" theme={error.theme}>
+          <FormErrorMessage className={cn(caption ? 'mt-1' : 'absolute top-full translate-y-1')} theme={error.theme}>
             {error.message}
           </FormErrorMessage>
         )}