Merge branch 'rp--input-component' of github.com:interledger/web-mone…

…tization-extension into rp--input-component
interledger · Jan 10, 2024 · a90bb5a · a90bb5a
2 parents d4060ca + 22ff46c
commit a90bb5a
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 22 deletions.
diff --git a/src/components/__tests__/input.test.tsx b/src/components/__tests__/input.test.tsx
@@ -43,7 +43,7 @@ describe('Input', () => {
     expect(queryByLabelText('test input')).toHaveClass('border-base')
   })
 
-  it('should have the `border-error` class when the `error` variant is passed', () => {
+  it('should have the `border-error` class when an error message is passed', () => {
     const { queryByLabelText } = render(<Input aria-label="test input" error />)
 
     expect(queryByLabelText('test input')).toBeInTheDocument()

diff --git a/src/components/input.tsx b/src/components/input.tsx
@@ -15,15 +15,9 @@ const inputVariants = cva(
       variant: {
         default: 'border-base',
       },
-      error: {
-        true: 'border-error',
-      },
       loading: {
         true: 'text-transparent',
       },
-      hasIcon: {
-        true: 'pl-12',
-      },
       disabled: {
         true: 'bg-disabled border-transparent',
       },
@@ -38,10 +32,9 @@ export interface InputProps
   extends VariantProps<typeof inputVariants>,
     React.InputHTMLAttributes<HTMLInputElement> {
   loading?: boolean
-  error?: boolean
+  error?: string
   disabled?: boolean
   icon?: React.ReactNode
-  type?: 'text' | 'password' | 'email' | 'number'
 }
 
 export const Input = forwardRef<HTMLInputElement, InputProps>(function Input(
@@ -54,7 +47,7 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(function Input(
       <input
         ref={ref}
         type={type}
-        className={cn(inputVariants({ loading, hasIcon: !!icon, disabled, error }), className)}
+        className={cn(inputVariants({ loading, disabled }), icon && 'pl-12', error && 'border-error', className)}
         disabled={disabled ?? loading ?? false}
         aria-disabled={disabled ?? loading ?? false}
         {...props}

diff --git a/src/components/label.tsx b/src/components/label.tsx
@@ -3,19 +3,8 @@ import React, { forwardRef } from 'react'
 
 import { cn } from '@/utils/cn'
 
-const labelVariants = cva(
-  ['text-medium font-medium leading-6 px-2 flex items-center gap-2'],
+const labelVariants = cva('text-medium font-medium leading-6',
 
-  {
-    variants: {
-      variant: {
-        default: 'border-base',
-      },
-    },
-    defaultVariants: {
-      variant: 'default',
-    },
-  },
 )
 
 export interface LabelProps