WardrikWeb. Components
(wardrik_web v0.1.0-rc.1)
Copy Markdown
Components and formatting helpers for dashboard pages.
Use them in extension pages to match the look of the dashboard.
import WardrikWeb.Components
<.head title="Fleet" lead="Runs and cost for each agent." />
<.status value="parked" />
Summary
Functions
An ISO 8601 time, shown as time ago, for example 5m ago.
A size in bytes, in the largest unit that keeps it at 1 or more: 512 B, 1.8 MB.
Describes what an agent is doing, given the latest event of its current run.
A list of events. Each row shows the time, the event type and a short preview. Click a row to see the full event.
Shows a flash message from a LiveComponent.
A page heading, with an optional breadcrumb, badge and action buttons.
A JSON value, pretty-printed.
Shows whether the page is receiving live updates.
Returns an error's message.
A bar that shows count as a share of limit, with both numbers and the percentage.
A cost given in micro-USD, formatted in dollars.
A number with thousands separators.
Says a settings page is off, and how to turn it on.
A menu for choosing an owner, such as an org or a person. Choosing one sends the "owner"
event with %{"owner" => owner}.
Renders the extensions' panels for slot, passing them assigns.
A one-line preview of event data. It shows the first three plain values, except except.
A small line chart of values, oldest first. Hover a point to see its value.
A status label for an agent or a run.
A small ⓘ mark that shows text on hover or keyboard focus.
A token count, abbreviated above a thousand: 8.4k, 1.2M.
A duration in milliseconds, shown in its two largest units: 850 ms, 4.2s, 3m 10s, 6d 20h.
A cost in dollars.
Functions
@spec ago(String.t() | nil, DateTime.t()) :: String.t()
An ISO 8601 time, shown as time ago, for example 5m ago.
A size in bytes, in the largest unit that keeps it at 1 or more: 512 B, 1.8 MB.
Describes what an agent is doing, given the latest event of its current run.
A list of events. Each row shows the time, the event type and a short preview. Click a row to see the full event.
Set :agent to show a link to each event's agent. The link needs :dashboard.
Attributes
events(:list) (required)empty(:string) - Defaults to"No events.".dashboard(:any) - Defaults tonil.agent(:boolean) - Defaults tofalse.
@spec flash(Phoenix.LiveView.Socket.t(), :info | :error, String.t()) :: Phoenix.LiveView.Socket.t()
Shows a flash message from a LiveComponent.
LiveView only shows a component's flash when the component navigates. This function sends the message to the parent LiveView, which shows it.
A page heading, with an optional breadcrumb, badge and action buttons.
Attributes
title(:string) (required)lead(:string) - Defaults tonil.
Slots
crumbbadgeactions
A JSON value, pretty-printed.
Attributes
value(:any) (required)
Shows whether the page is receiving live updates.
Attributes
live(:boolean) (required)stopped(:string) - Defaults tonil.
@spec message(Wardrik.Error.t() | String.t()) :: String.t()
Returns an error's message.
A bar that shows count as a share of limit, with both numbers and the percentage.
At 80% or more the bar turns red and says it's near the limit. Set :warn to false for a
share that isn't a limit.
Attributes
label(:string) (required)count(:integer) (required)limit(:integer) (required)format(:any) - Defaults to&WardrikWeb.Components.number/1.warn(:boolean) - Defaults totrue.tip(:string) - explains the bar, shown on hover or focus. Defaults tonil.
@spec micro_usd(non_neg_integer() | nil) :: String.t()
A cost given in micro-USD, formatted in dollars.
A number with thousands separators.
Says a settings page is off, and how to turn it on.
Attributes
key(:atom) (required)behaviour(:atom) (required)
A menu for choosing an owner, such as an org or a person. Choosing one sends the "owner"
event with %{"owner" => owner}.
Attributes
owners(:list) (required)owner(:string) (required)
Renders the extensions' panels for slot, passing them assigns.
Attributes
dashboard(WardrikWeb.Dashboard) (required)slot(:atom) (required)scope(:any) (required)assigns(:map) - Defaults to%{}.
A one-line preview of event data. It shows the first three plain values, except except.
A small line chart of values, oldest first. Hover a point to see its value.
:format turns a value into the text the tooltip shows. Set :max for a fixed scale from 0
to :max. Without it, the scale fits the values, so small changes are visible.
Attributes
values(:list) (required)label(:string) (required)format(:any) - Defaults tonil.max(:any) - Defaults tonil.
A status label for an agent or a run.
Attributes
value(:string) (required)
A small ⓘ mark that shows text on hover or keyboard focus.
Attributes
text(:string) (required)
A token count, abbreviated above a thousand: 8.4k, 1.2M.
@spec took(non_neg_integer() | nil) :: String.t()
A duration in milliseconds, shown in its two largest units: 850 ms, 4.2s, 3m 10s, 6d 20h.
A cost in dollars.