Web3.Ui.AccountPill

The standard dapp header unit: one pill that is the whole wallet story.

Renders per Wallet.State:

Disconnected / Error — a connect button
Connecting — the connect button, busy
ReadOnly — a "read-only" chip (no wallet, reads work)
Connected — identicon · truncated address · chain chip · optional balance · disconnect
WrongChain — the same pill flagged, chain chip shows the mismatch

AccountPill.view
    { onConnect = ConnectClicked
    , onDisconnect = DisconnectClicked
    , chainLabel = Chain.nameOf     -- T.ChainId -> String
    , balance = model.plsBalance    -- Maybe String, pre-formatted
    }
    model.wallet

CSS classes: web3-pill, web3-pill--connect, --connecting, --readonly, --connected, --wrong-chain; web3-pill__identicon, web3-pill__address, web3-pill__chain, web3-pill__balance, web3-pill__disconnect.

view : Config msg -> State -> Html msg

Render the pill for any wallet state.

type alias Config msg =

{ onConnect : msg

, onDisconnect : msg

, chainLabel : ChainId -> String

, balance : Maybe String

}

Handlers plus how to name a chain and what balance to show (already formatted — pair with Web3.Ui.Amount).

intrepidshape/elm-web3-ui/2.2.0

Web3.Ui.AccountPill

Modules