DevactionUI.Button (devaction_ui v0.1.0)

Copy Markdown View Source

The buttons of the canvas, as a button or as a link, in the same colors and sizes.

variant says what the action means: :primary (the one thing to do), :secondary, :ghost, :ai (what the AI offers), :danger (asking for changes), :info (leading to something to learn), :link. size is :sm (38px), :md (46px) or :lg (54px). With navigate, patch or href it is a link that looks like a button; without, a real <button>. loading shows a spinner and sets aria-busy.

It is called as <Button.button> (alias DevactionUI.Button), not imported, so it does not collide with the button/1 of another UI kit in the same app.

Summary

Functions

button(assigns)

Attributes

  • variant (:atom) - Defaults to :secondary. Must be one of :primary, :secondary, :ghost, :ai, :danger, :info, or :link.
  • size (:atom) - Defaults to :md. Must be one of :sm, :md, or :lg.
  • loading (:boolean) - Defaults to false.
  • disabled (:boolean) - Defaults to false.
  • icon_only (:boolean) - a square button with just an icon; give it an aria-label. Defaults to false.
  • class (:any) - Defaults to nil.
  • Global attributes are accepted. Supports all globals plus: ["href", "navigate", "patch", "method", "download", "name", "value", "form", "type", "target", "rel"].

Slots

  • inner_block (required)