Upsell Button

Buttons allow users to perform an action.

#

Refer to Button on usage patterns for an upsell button.

To use UpsellButton as a link, add the href and optional isExternal props.

#

Initial

Disabled

Loading

#

#

  • When performing an action related to upselling customers to a different billing plan or unlocking product features.

Refer to Button for additional guidelines for an upsell button.

#

NameDefaultDescription
isLoading

boolean

Toggles the loading state.

isDisabled

boolean

Toggles the disabled state.

isJustified

boolean

Take up an entire available container width.

href

string

Optional URL to navigate to when the button is clicked. If provided, the button will render as an anchor tag.

isExternal

boolean

If true, the href will open in a new tab.

children

ReactNode

Button text.

size

"sm" | "md" | "lg"

Determines the height of the button.

icon

ComponentType<SVGAttributes<SVGElement>>

Primary icon that's displayed on the left.

On this page

  • Usage
  • Links
  • Combinations
  • Guidelines
  • When to use
  • Props