Mask

Simple libreary to mask strings and inputs.

Pattern

Represent the pattern that will be applied to the string to mask

Helpers

Creates a pattern from a String, using

to match digits and * for any character.

phonePattern : Pattern


phonePatter =
    Mask.fromString "(###)###-####"

Masking / Unmasking strings

mask : Pattern -> String -> String

Masks a string, useful for displaying formatted data.

maskPhone : String -> String
maskPhone phoneNumber =
    Mask.mask phonePattern phoneNumber


maskPhone "1231231234" == "(123)123-1234"

unMask : Pattern -> String -> String

Unmasks a string.

unmaskPhone : String -> String
unmaskPhone phoneNumber =
    Mask.unMask phonePattern phoneNumber


maskPhone "(123)123-1234" == "1231231234"

Input helpers

maskedValue : Pattern -> String -> Attribute msg

Similar to Html.Attributes.value, but applying the provided pattern

input [ maskedValue phonePattern model.phoneNumber ] []

onMaskedInput : Pattern -> String -> (String -> msg) -> Attribute msg

Similar to Html.Events.onInput, but unmasking a masked value. It requires the previous value as the second argument

type Msg = SetPhone String


input
    [ maskedValue phonePattern model.phoneNumber
    , onMaskedValue phonePattern model.phoneNumber SetPhoneNumber
    ]
    []

Modules

Mask

agustinrhcp/elm-mask/1.0.0