Button with icon

Last updated: 2.0.0 (18/01/2024)

A button used to display both an icon and text. If the button is loading, the icon will be replaced with a Loader. Like the text button, this button also uses the Text component to render text.

Usage

import { ButtonWithIcon } from "@valence-ui/core";
import { IconPlus } from "@tabler/icons-react";

function MyComponent() { 
    return ( 
        <ButtonWithIcon
            size="md"
            radius="sm"
            variant="light"
            icon={<IconPlus />}
        >
            Text and an icon!
        </ButtonWithIcon>
    )
}

Props

Extends TextButtonProps.

Property
Type
Description

icon (required)

ReactNode

The icon to include with this button.

iconPosition

"left" | "right"

The position of the icon relative to the text. Defaults to "left".

Last updated

Was this helpful?