add container
This commit is contained in:
@@ -1,4 +1,4 @@
|
||||
import React, { forwardRef, useContext, useId } from 'react'
|
||||
import React, { createElement, forwardRef, useContext, useId } from 'react'
|
||||
import { ExclamationCircleIcon } from '@heroicons/react/24/outline'
|
||||
import { omit } from 'ramda'
|
||||
import { Loader } from './loader'
|
||||
@@ -42,7 +42,7 @@ export function Button({
|
||||
props['disabled'] = isLoading
|
||||
}
|
||||
|
||||
return React.createElement(
|
||||
return createElement(
|
||||
as,
|
||||
{
|
||||
className: clsx(
|
||||
@@ -90,15 +90,13 @@ export const Input = forwardRef(function Input(
|
||||
const { className: _, ...field } = useControl(props)
|
||||
const sizes = { base: 'h-12' }
|
||||
|
||||
return React.createElement(
|
||||
return createElement(
|
||||
as,
|
||||
{
|
||||
className: clsx(
|
||||
'bg-white outline-none px-4 rounded-lg transition',
|
||||
'border border-green-light dark:border-gray-700 dark:bg-gray-800',
|
||||
'focus:ring-1 focus:border-green-secondary focus:ring-green-secondary focus:placeholder:text-transparent',
|
||||
// Tailwind's won't inherit focus behavior; you must define it explicitly for both modes.
|
||||
'dark:focus:border-green-secondary',
|
||||
'aria-[invalid=true]:border-red-400 aria-[invalid=true]:ring-red-400',
|
||||
'dark:aria-[invalid=true]:border-red-500 dark:aria-[invalid=true]:ring-red-500',
|
||||
'disabled:text-gray-400 disabled:border-gray-300 disabled:bg-gray-200',
|
||||
@@ -123,10 +121,10 @@ export const Checkbox = forwardRef(function Checkbox(
|
||||
<input
|
||||
type="checkbox"
|
||||
className={clsx(
|
||||
'text-green-secondary border border-gray-300',
|
||||
'focus:ring-2 focus:border-green-secondary focus:ring-green-secondary focus:ring-offset-0 focus:ring-opacity-30',
|
||||
'dark:border-gray-700 dark:bg-gray-800 focus:dark:border-security dark:checked:bg-green-secondary dark:checked:border-security dark:disabled:bg-gray-700',
|
||||
'disabled:bg-gray-200 outline-none rounded transition',
|
||||
// 'text-green-secondary border border-gray-300',
|
||||
// 'focus:ring-2 focus:border-green-secondary focus:ring-green-secondary focus:ring-offset-0 focus:ring-opacity-30',
|
||||
// 'dark:border-gray-700 dark:bg-gray-800 focus:dark:border-security dark:checked:bg-green-secondary dark:checked:border-security dark:disabled:bg-gray-700',
|
||||
// 'disabled:bg-gray-200 outline-none rounded transition',
|
||||
className,
|
||||
)}
|
||||
ref={ref}
|
||||
|
||||
Reference in New Issue
Block a user