abadi199 / elm-input-extra / MaskedInput.Number

Masked Number input, similar to Masked Text input, but only accepting numeric input

State


type State

Opaque type for storing local State

initialState : State

Initial state

View

input : Options msg -> List (Html.Attribute msg) -> State -> Maybe Basics.Int -> Html msg

Masked Number input element

Example:

type Msg = InputUpdated (Maybe Int) | StateUpdated MaskedInput.State | FocusUpdated Bool

MaskedInput.Number.input
    { pattern = "(###) ###-####"
    , inputCharacter = '#'
    , onInput = InputUpdated
    , toMsg = StateUpdated
    , hasFocus = Just FocusUpdated
    }
    [ class "masked-input"
    ...
    ]
    model.currentState
    model.currentValue


type alias Options msg =
{ pattern : String
, inputCharacter : Char
, onInput : Maybe Basics.Int -> msg
, toMsg : State -> msg
, hasFocus : Maybe (Basics.Bool -> msg) 
}

Options of the input component.

defaultOptions : (Maybe Basics.Int -> msg) -> (State -> msg) -> Options msg

Default value for Options.

Value:

{ pattern = ""
, inputCharacter = '#'
, onInput = onInput
, toMsg = toMsg
, hasFocus = Nothing
}