PhiaUi.Components.Data.DeltaBar (phia_ui v0.1.17)

Copy Markdown View Source

Horizontal bar showing positive/negative delta from a center point.

Inspired by Tremor's DeltaBar component. The bar is split in half with a center divider. Positive values extend right, negative extend left. Color changes based on whether increase is considered positive.

Examples

<.delta_bar value={25} />
<.delta_bar value={-15} is_increase_positive={false} />

Summary

Functions

delta_bar(assigns)

Attributes

  • value (:any) (required) - Delta value (-100 to 100).
  • is_increase_positive (:boolean) - If true, positive values are green; if false, positive values are red. Defaults to true.
  • show_animation (:boolean) - Animate the bar width. Defaults to false.
  • tooltip (:string) - Tooltip text. Defaults to nil.
  • class (:string) - Defaults to nil.
  • Global attributes are accepted.