Open crystal4000 opened 3 months ago
href
The Button Component should have these types:
`type Variant =
| "default" | "primary" | "destructive" | "subtle" | "loading" | "outline" | "secondary" | "ghost" | "link";`
type Size = "default" | "sm" | "lg" | "link" | "icon" | "circle";
The Button component should have the following props:
leftIcon?: React.ReactElement
rightIcon?: React.ReactElement
isLoading?: boolean
href?: string
variant?: Variant
size?: Size
icon?: React.ReactNode
children?: React.ReactNode
isIconOnly?: boolean
isLeftIconVisible?: boolean
isRightIconVisible?: boolean
isDisabled?: boolean
ariaLabel?: string
@shuaibu-shehu has your pr on this been merged
no, I dropped it someone did it already
Description
Create reusable Button components with customizable features. The components should also support an optional
href
prop to convert it into a link.Acceptance Criteria
Disclaimer
Requirements
The Button Component should have these types:
`type Variant =
| "default" | "primary" | "destructive" | "subtle" | "loading" | "outline" | "secondary" | "ghost" | "link";`
type Size = "default" | "sm" | "lg" | "link" | "icon" | "circle";
The Button component should have the following props:
leftIcon?: React.ReactElement
(optional element for left icon)rightIcon?: React.ReactElement
(optional element for right icon)isLoading?: boolean
(displays a spinner on the left side when true)href?: string
(optional URL for converting the button into a link))variant?: Variant
(Specifies the button style variant )size?: Size
(Icon to be displayed inside the button)icon?: React.ReactNode
(Text or elements to be displayed inside the button)children?: React.ReactNode
(Indicates if the button is in a loading state)isIconOnly?: boolean
( Indicates if the button is icon only)isLeftIconVisible?: boolean
( Indicates if the left icon is visible )isRightIconVisible?: boolean
( Indicates if the right icon is visible )isDisabled?: boolean
(Disables the button if true )ariaLabel?: string
(Href to link button to a URL or route )Tasks
href
prop.Figma Design
Link