Skip to content
Build type-safe composable forms in Elm
Branch: master
Clone or download
Latest commit 9c0a3ed Apr 5, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
examples
src
tests Merge branch 'master' into feature/variable-form Dec 18, 2018
.gitignore Fix tests and format Sep 2, 2018
.travis.yml Merge branch 'master' into feature/variable-form Oct 15, 2018
CHANGELOG.md
LICENSE Add LICENSE Apr 13, 2018
README.md Move Ellie snippet to 'Demo / Examples' section in README Nov 7, 2018
elm.json Bump version Apr 5, 2019

README.md

composable-form Build Status

This package allows you to build forms that are

  • Composable: they can be extended and embedded in other forms.
  • Type-safe: everything is safely tied together with compiler guarantees.
  • Maintainable: you do not need view code nor a msg for each form field.
  • Concise: field validation and update logic are defined in a single place.
  • Consistent: validation errors are always up-to-date with the current field values.
  • Extensible: you can create your own custom fields and write custom view code.

Here is an example that defines a login form:

module Form.Login exposing (Output, Values, form)

import EmailAddress exposing (EmailAddress)
import Form exposing (Form)


type alias Values =
    { email : String
    , password : String
    , rememberMe : Bool
    }


type alias Output =
    { email : EmailAddress
    , password : String
    , rememberMe : Bool
    }


form : Form Values Output
form =
    let
        emailField =
            Form.emailField
                { parser = EmailAddress.parse
                , value = .email
                , update = \value values -> { values | email = value }
                , attributes =
                    { label = "E-Mail"
                    , placeholder = "some@email.com"
                    }
                }

        passwordField =
            Form.passwordField
                { parser = Ok
                , value = .password
                , update = \value values -> { values | password = value }
                , attributes =
                    { label = "Password"
                    , placeholder = "Your password"
                    }
                }

        rememberMeCheckbox =
            Form.checkboxField
                { parser = Ok
                , value = .rememberMe
                , update = \value values -> { values | rememberMe = value }
                , attributes =
                    { label = "Remember me" }
                }
    in
    Form.succeed Output
        |> Form.append emailField
        |> Form.append passwordField
        |> Form.append rememberMeCheckbox

Read the Form module documentation to understand how this code works.

Demo / Examples

Try out the live demo and/or check out the examples.

Also, feel free to play with the package using this Ellie snippet.

Contributing / Feedback

Feel free to fork and open issues or pull requests. You can also come to chat in the #forms channel on the Elm Slack, feel free to contact me (@hecrj) there!

You can’t perform that action at this time.