import { NButton } from '@nayan-ui/react';

const Button = () => {
  return (
    <div className="flex flex-wrap gap-2">
      <NButton onClick={() => console.log('clicked')}>Primary</NButton>
      <NButton isOutline={true}>Outline</NButton>
      <NButton isLoading={true}>Loading</NButton>
      <NButton disabled>Disabled</NButton>
    </div>
  );
};

export default Button;

Attributes

Name	Type	Default	Details
children	React.ReactNode	Required	Button label content.
icon	React.ComponentType<any> \| React.ReactElement	Optional	Icon component or element to display.
variant	'primary' \| 'secondary' \| 'outline' \| 'ghost' \| 'link'	'primary'	Button variant style.
size	'sm' \| 'md' \| 'lg'	'md'	Button size.
isDisabled	boolean	false	Whether the button is disabled.
onPress	() => void	Optional	Callback when button is pressed.
className	string	' '	You can customise by passing tailwind classes.

Button

Demo

Demo Coming Soon

Usage

Attributes

Tags