ohanhi/autoexpand/1.0.0

NOTE: this package is not compatible with Elm 0.19.1

AutoExpand

This library lets you use automatically expanding textareas in Elm. This means the textarea grows in height until it reaches the maximum number of rows allowed and then becomes a scrollable box.

View

view : Config msg -> State -> String -> Html msg

Show the textarea on your page.

view : Model -> Html Msg
view model =
    AutoExpand.view config model.autoExpandState model.textValue

Configuration

{ onInput :
{ textValue : String
, state : State
}
-> msg
, padding : Float
, lineHeight : Float
, minRows : Int
, maxRows : Int
, styles : List ( String, String )
}
-> Config msg

Create the Config for the auto expanding textarea.

A typical configuration might look like this:

type Msg
    = AutoExpandInput { textValue : String, state : AutoExpand.State }


config : AutoExpand.Config Msg
config =
    AutoExpand.config
        { onInput = AutoExpandInput
        , padding = 10
        , lineHeight = 20
        , minRows = 1
        , maxRows = 4
        , styles = [ ( "font-family", "sans-serif" ) ]
        }
type Config msg

Configuration for your textarea, describing the look and feel.

Note: Your Config should never be held in your model. It should only appear in view code.

State

type State

Keeps track of how many rows we need.

initState : Config msg -> State

Sets up the initial State for the textarea using a Config.