tabbable : Basics.Bool -> Html.Styled.Attribute msg
Add or remove an element from the normal flow of tabbable/focusable elements.
tabbable True
will set the tabindex to 0, and tabbable False
will set the tabindex to -1.
You may use Html.Styled.Attributes.tabindex
if you need to control the tab order more explicitly, but you may want to restructure your HTML to match how you want users to interact with it instead. If you're considering changing tabindex or restructuring your HTML, read Understanding Success Criterion 1.3.2: Meaningful Sequence.
onKeyDown : List (Event msg) -> Html.Styled.Attribute msg
Pass a list of keyboard events to match.
onKeyDown [ enter TheyHitEnterDoSomething, left DoSomeOtherThing ]
onKeyDownPreventDefault : List (Event msg) -> Html.Styled.Attribute msg
Pass a list of keyboard events to match.
onKeyDownPreventDefault [ space TheyHitEnterDoSomethingButDontScrollThePage ]
onKeyUp : List (Event msg) -> Html.Styled.Attribute msg
Pass a list of keyboard events to match.
onKeyUp [ enter TheyHitEnterDoSomething, left DoSomeOtherThing ]
onKeyUpPreventDefault : List (Event msg) -> Html.Styled.Attribute msg
Pass a list of keyboard events to match.
onKeyUpPreventDefault [ space TheyHitEnterDoSomethingButDontScrollThePage ]
Note: the API here is different than in previous versions of this library because of https://github.com/elm/json/issues/15. A future version of this library may return to using generic decoders.
{ keyCode : Basics.Int
, shiftKey : Basics.Bool
, msg : msg
}
tab : msg -> Event msg
Use with onKeyDown
to succeed when user hits the tab key.
onKeyDown [ tab Tab ]
tabBack : msg -> Event msg
Use with onKeyDown
to succeed when user hits the tab key while hitting shift.
onKeyDown [ tabBack GoBack ]
up : msg -> Event msg
Use with onKeyDown
to succeed when user hits the up arrow key without the shift key.
onKeyDown [ up Up ]
right : msg -> Event msg
Use with onKeyDown
to succeed when user hits the right arrow key without the shift key.
onKeyDown [ right Right ]
down : msg -> Event msg
Use with onKeyDown
to succeed when user hits the down arrow key without the shift key.
onKeyDown [ down Down ]
left : msg -> Event msg
Use with onKeyDown
to succeed when user hits the left arrow key without the shift key.
onKeyDown [ left Left ]
shift : msg -> Event msg
Succeed when user hits the shift key by itself.
onKeyDown [ shift Shift ]
shiftUp : msg -> Event msg
Succeed when user hits the up arrow key with the shift key.
onKeyDown [ shiftUp Up ]
shiftRight : msg -> Event msg
Succeed when user hits the right arrow key with the shift key.
onKeyDown [ shiftRight Right ]
shiftDown : msg -> Event msg
Succeed when user hits the down arrow key with the shift key.
onKeyDown [ shiftDown Down ]
shiftLeft : msg -> Event msg
Succeed when user hits the left arrow key with the shift key.
onKeyDown [ shiftLeft Left ]
enter : msg -> Event msg
Use with onKeyDown
to succeed when user hits the Enter key.
onKeyDown [ enter TheyHitEnterDoSomething ]
space : msg -> Event msg
Use with onKeyDown
to succeed when user hits the spacebar.
onKeyDown [ space SpaceBar ]
escape : msg -> Event msg
Use with onKeyDown
to succeed when user hits esc
.
onKeyDown [ escape CloseModal ]
customOneOf : List (Event msg) -> Json.Decode.Decoder msg
This exists because Json.Decode.oneOf is broken in a way that causes weird & hard-to-diagnose bugs.