This commit is contained in:
@@ -24,40 +24,40 @@ const SIZE_CLASS: Record<ComponentSize, string> = {
|
||||
sm: 'h-8 px-3 text-xs',
|
||||
md: 'h-10 px-4 text-sm',
|
||||
lg: 'h-12 px-5 text-base',
|
||||
full: 'h-10 w-full px-4 text-sm'
|
||||
full: 'h-10 w-full px-4 text-sm',
|
||||
};
|
||||
|
||||
const ICON_ONLY_SIZE_CLASS: Record<ComponentSize, string> = {
|
||||
sm: 'h-8 w-8 !p-0',
|
||||
md: 'h-10 w-10 !p-0',
|
||||
lg: 'h-12 w-12 !p-0',
|
||||
full: 'h-10 w-full !p-0'
|
||||
full: 'h-10 w-full !p-0',
|
||||
};
|
||||
|
||||
const ICON_CLASS: Record<ComponentSize, string> = {
|
||||
sm: 'h-4 w-4',
|
||||
md: 'h-4 w-4',
|
||||
lg: 'h-5 w-5',
|
||||
full: 'h-4 w-4'
|
||||
full: 'h-4 w-4',
|
||||
};
|
||||
|
||||
const ICON_ONLY_CLASS: Record<ComponentSize, string> = {
|
||||
sm: 'h-4 w-4',
|
||||
md: 'h-5 w-5',
|
||||
lg: 'h-6 w-6',
|
||||
full: 'h-5 w-5'
|
||||
full: 'h-5 w-5',
|
||||
};
|
||||
|
||||
const TYPE_CLASS: Record<ButtonType, string> = {
|
||||
solid: 'btn-solid',
|
||||
outlined: 'btn-outlined',
|
||||
noborder: 'btn-noborder'
|
||||
noborder: 'btn-noborder',
|
||||
};
|
||||
|
||||
const VARIANT_CLASS: Record<ButtonVariant, string> = {
|
||||
primary: 'btn-primary',
|
||||
secondary: 'btn-secondary',
|
||||
important: 'btn-important'
|
||||
important: 'btn-important',
|
||||
};
|
||||
|
||||
function resolveVariant(type: ButtonType, variant?: ButtonVariant): ButtonVariant {
|
||||
@@ -79,7 +79,7 @@ export function Button({
|
||||
disabled = false,
|
||||
icon: Icon,
|
||||
ariaLabel,
|
||||
className = ''
|
||||
className = '',
|
||||
}: Readonly<ButtonProps>) {
|
||||
const isIconOnly = Icon != null && !label;
|
||||
const resolvedVariant = resolveVariant(type, variant);
|
||||
@@ -89,8 +89,10 @@ export function Button({
|
||||
isIconOnly ? ICON_ONLY_SIZE_CLASS[size] : SIZE_CLASS[size],
|
||||
Icon && label ? 'gap-1.5' : '',
|
||||
disabled ? 'pointer-events-none cursor-not-allowed opacity-45 saturate-50' : '',
|
||||
className
|
||||
].join(' ').trim();
|
||||
className,
|
||||
]
|
||||
.join(' ')
|
||||
.trim();
|
||||
const computedAriaLabel = ariaLabel ?? label;
|
||||
const iconClass = `${isIconOnly ? ICON_ONLY_CLASS[size] : ICON_CLASS[size]} shrink-0`;
|
||||
const content = (
|
||||
|
||||
Reference in New Issue
Block a user