feat: update
This commit is contained in:
45
libs/registry/registry/components/b/button/button.tsx
Normal file
45
libs/registry/registry/components/b/button/button.tsx
Normal file
@@ -0,0 +1,45 @@
|
||||
import React from 'react';
|
||||
import { cva, type VariantProps } from 'class-variance-authority';
|
||||
|
||||
import { twMerge } from 'tailwind-merge';
|
||||
|
||||
const button = cva('button', {
|
||||
variants: {
|
||||
intent: {
|
||||
primary: ['bg-blue-500', 'text-white', 'border-transparent'],
|
||||
secondary: ['bg-white', 'text-gray-800', 'border-gray-400'],
|
||||
},
|
||||
size: {
|
||||
small: ['text-sm', 'py-1', 'px-2'],
|
||||
medium: ['text-base', 'py-2', 'px-4'],
|
||||
},
|
||||
disabled: {
|
||||
false: null,
|
||||
true: ['opacity-50', 'cursor-not-allowed'],
|
||||
},
|
||||
},
|
||||
compoundVariants: [
|
||||
{
|
||||
intent: 'primary',
|
||||
disabled: false,
|
||||
class: 'hover:bg-blue-600',
|
||||
},
|
||||
{
|
||||
intent: 'secondary',
|
||||
disabled: false,
|
||||
class: 'hover:bg-gray-100',
|
||||
},
|
||||
{ intent: 'primary', size: 'medium', class: 'uppercase' },
|
||||
],
|
||||
defaultVariants: {
|
||||
disabled: false,
|
||||
intent: 'primary',
|
||||
size: 'medium',
|
||||
},
|
||||
});
|
||||
|
||||
export interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'disabled'>, VariantProps<typeof button> {}
|
||||
|
||||
export const Button: React.FC<ButtonProps> = ({ className, intent, size, disabled, ...props }) => (
|
||||
<button className={twMerge('cursor-pointer', button({ intent, size, disabled, className }))} disabled={disabled || undefined} {...props} />
|
||||
);
|
Reference in New Issue
Block a user