Noora.Button (noora v0.86.0)

Copy Markdown

A component for rendering both standard buttons and link-style buttons, offering flexible styling options for variants, sizes, and icon placement.

Summary

Functions

button(assigns)
button_sizes()
button_variants()
link_button(assigns)
neutral_button(assigns)

Functions

button(assigns)

Attributes

  • label (:string) - Provides fallback text when the default slot is empty. Defaults to "".
  • variant (:string) - Controls the visual emphasis and semantic intent. Defaults to "primary". Must be one of "primary", "secondary", or "destructive".
  • size (:string) - Controls the button dimensions and text size. Defaults to "large". Must be one of "small", "medium", or "large".
  • href (:any) - Uses traditional browser navigation to the new location. Defaults to nil.
  • navigate (:string) - Navigates to a LiveView. Defaults to nil.
  • patch (:string) - Patches the current LiveView. Defaults to nil.
  • icon_only (:boolean) - Uses the default slot as the entire button content. An accessible label is required. Defaults to false.
  • Global attributes are accepted. Supports all globals plus: ["phx-click", "disabled", "form"].

Slots

  • icon_left - Icon displayed on the left of an item.
  • icon_right - Icon displayed on the right of an item.
  • inner_block - Inner block that renders HEEx content.

button_sizes()

button_variants()

neutral_button(assigns)

Attributes

  • variant (:string) - Controls the visual emphasis and semantic intent. Defaults to "primary". Must be one of "primary", "secondary", or "destructive".
  • size (:string) - Controls the button dimensions and text size. Defaults to "large". Must be one of "small", "medium", or "large".
  • href (:any) - Uses traditional browser navigation to the new location. Defaults to nil.
  • navigate (:string) - Navigates to a LiveView. Defaults to nil.
  • patch (:string) - Patches the current LiveView. Defaults to nil.
  • Global attributes are accepted. Supports all globals plus: ["phx-click", "disabled"].

Slots

  • inner_block (required) - Inner block that renders HEEx content.