AuroraMeter.Components (Aurora Meter v0.4.0)

View Source

Drop-in HEEx components for showing live usage and credit spend. Compiled only when Phoenix.Component is available (the LiveView deps are optional).

They are unstyled by design (BEM-style aurora-meter__*, aurora-spend-chart__* and aurora-credit-summary__* classes) so they inherit your app's look; the Pro dashboard ships a styled version. Nothing here declares a colour: the charts paint with currentColor, so they take the text colour your design system already set. There is no JavaScript — the chart is inline SVG and the tooltips are <title> elements. Pair with AuroraMeter.LiveView.subscribe/1 for live usage updates.

Money components render dollars through AuroraMeter.Credits.Money, never raw micro-dollars:

<.spend_chart points={AuroraMeter.Credits.spend_history(@org, days: 30)} />
<.credit_summary summary={AuroraMeter.Credits.summary(@org)} />

Summary

Functions

Renders the credit balance and burn from AuroraMeter.Credits.summary/1 as a description list.

Renders a spend-per-bucket bar chart from AuroraMeter.Credits.spend_history/2.

Renders a labelled usage bar for one feature, driven by AuroraMeter.quota/2.

Renders a usage meter for every feature in the tenant's plan.

Functions

credit_summary(assigns)

Renders the credit balance and burn from AuroraMeter.Credits.summary/1 as a description list.

Held, promotional and granted figures only appear when they are non-zero. daily_burn and runway_days render as "—" when they are nil — there is no honest number to show for a tenant that has not spent anything, and this component will not invent one.

Examples

<.credit_summary summary={AuroraMeter.Credits.summary(@org)} />

Attributes

  • summary (:map) (required)
  • Global attributes are accepted.

spend_chart(assigns)

Renders a spend-per-bucket bar chart from AuroraMeter.Credits.spend_history/2.

Every bucket in points gets a bar, including the empty ones: a zero-spend day is a baseline, never a gap. Buckets where credit was granted carry a marker above the bar when show_grants is set. Amounts in the axis labels and in the <title> tooltips are dollars, formatted with AuroraMeter.Credits.Money.format/2.

Examples

<.spend_chart points={AuroraMeter.Credits.spend_history(@org, days: 30)} />

<.spend_chart
  points={AuroraMeter.Credits.spend_history(@org, bucket: :month, days: 365)}
  label="Spend per month"
  height={160}
/>

Attributes

  • points (:list) (required)
  • height (:integer) - Defaults to 120.
  • label (:string) - Defaults to "Spend per day".
  • show_grants (:boolean) - Defaults to true.
  • Global attributes are accepted.

usage_meter(assigns)

Renders a labelled usage bar for one feature, driven by AuroraMeter.quota/2.

Hard caps show used / limit; metered features show used / included and flag overage; counters show the bare count with no bar (they have no denominator — ADR 0006); boolean features show whether they are enabled; integer features show their plan value.

Attributes

  • tenant (:any) (required)
  • feature (:atom) (required)
  • label (:string) - Defaults to nil.
  • Global attributes are accepted.

usage_summary(assigns)

Renders a usage meter for every feature in the tenant's plan.

Attributes

  • tenant (:any) (required)
  • Global attributes are accepted.