Web3.Ui.Form

Accumulating form validation -- combine per-field results into one Validated args where every problem is collected, not just the first. The applicative sibling of the per-field validation the input atoms (Web3.Ui.Input, Web3.Ui.Amount) already do.

type alias SendForm =
    { to : T.Address, amount : BigInt }


validated : Model -> Validated SendForm
validated model =
    succeed SendForm
        |> andMap (fromMaybe "Recipient is not a valid address" model.parsedTo)
        |> andMap (fromMaybe "Amount is not a valid number" model.parsedAmount)


-- in view: disable the button and show ALL the problems
button [ disabled (not (Form.isValid v)) ] ...
Form.errorList [] v

Result short-circuits on the first Err; forms shouldn't -- a user fixing a three-field form one error at a time is the classic papercut this type removes.

CSS classes: web3-form-errors, web3-form-errors__item.

type alias Validated a =

Result (List String) a

A value that is either fully valid or carries every accumulated problem.

succeed : a -> Validated a

Start a pipeline with the record constructor.

fail : String -> Validated a

A single failure.

fromMaybe : String -> Maybe a -> Validated a

Lift a parsed field: Nothing becomes the given error. The natural bridge from T.address / BigInt.fromString / Units.parseUnits.

andMap : Validated a -> Validated (a -> b) -> Validated b

Apply the next field, accumulating errors from both sides.

map : (a -> b) -> Validated a -> Validated b

map2 : (a -> b -> c) -> Validated a -> Validated b -> Validated c

errors : Validated a -> List String

All accumulated problems (empty when valid).

isValid : Validated a -> Bool

errorList : List (Attribute msg) -> Validated a -> Html msg

Render the problems as a list (role="alert"), or nothing when valid.

intrepidshape/elm-web3-ui/4.0.0

Web3.Ui.Form

Modules