# XWUIBudgetWorkbench

A list-detail workbench for department/category budgets: a roster pane
(`basic/XWUIList`) selects into a detail pane that composes
`basic/XWUIProgressBar` (spend utilization, colored `success`/`warning`/
`error` by status), `basic/XWUIDescriptionList` (Allocated/Spent/Remaining,
plus Period/Owner when present), a transactions `basic/XWUITable`
(date/description/amount, only when the line has `transactions`) and
`basic/XWUIQuickActions` (Approve - shown only when the line is `at-risk` or
`over-budget` and actually needs sign-off; Export - shown only when there are
transactions to export; Flag and Note always shown). Selection defaults to
the first budget line and is controllable via `data.selectedId`; a click on a
roster row, a call to `selectBudget(id)`, and a `host.data = {...}` write on
the custom element all go through the same path.

A line's `status` is optional - when omitted it is derived from
`spent / allocated` (over 100% -> over-budget, 90%+ -> at-risk, under 50% ->
under-budget, else on-track), so a host that never sends `status` still gets
a coherent color/label pair.

`data.loading` and `data.error` take precedence over the roster and leave the
detail pane blank, so a host wiring this to a real fetch does not need a
separate skeleton component.

This is the first component in `industry/finance/` - it is what
`XWUISuperFinance` mounts for its `fin-budgets` menu leaf.
`fin-cashflow`, `fin-forecasts` and `fin-reports` still mount the shell's
placeholder.

## Basic Usage

Three budget lines spanning every status (on-track, at-risk, over-budget),
one of them with recent transactions, so every gated detail widget (Approve
action, Export action, transactions table) is visible on at least one of them.

```api
```
