804c1263d5
* feat(i18n): Enhance RTL support and update language direction handling * format * minor tweaks --------- Co-authored-by: CJ Pais <cj@cjpais.com>
32 lines
921 B
TypeScript
32 lines
921 B
TypeScript
import React from "react";
|
|
|
|
interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
|
|
variant?: "default" | "compact";
|
|
}
|
|
|
|
export const Input: React.FC<InputProps> = ({
|
|
className = "",
|
|
variant = "default",
|
|
disabled,
|
|
...props
|
|
}) => {
|
|
const baseClasses =
|
|
"px-2 py-1 text-sm font-semibold bg-mid-gray/10 border border-mid-gray/80 rounded text-start transition-all duration-150";
|
|
|
|
const interactiveClasses = disabled
|
|
? "opacity-60 cursor-not-allowed bg-mid-gray/10 border-mid-gray/40"
|
|
: "hover:bg-logo-primary/10 hover:border-logo-primary focus:outline-none focus:bg-logo-primary/20 focus:border-logo-primary";
|
|
|
|
const variantClasses = {
|
|
default: "px-3 py-2",
|
|
compact: "px-2 py-1",
|
|
} as const;
|
|
|
|
return (
|
|
<input
|
|
className={`${baseClasses} ${variantClasses[variant]} ${interactiveClasses} ${className}`}
|
|
disabled={disabled}
|
|
{...props}
|
|
/>
|
|
);
|
|
};
|