Select.Primitives.Container
- Package
- purescript-halogen-select
- Repository
- citizennet/purescript-halogen-select
#ContainerQuery Source
data ContainerQuery o item a
The query type for the Container
primitive.
Highlight
: Change the highlighted item to the next, previous, or a specific index.Select
: Select an item at the specified indexKey
: Capture key events for arrow navigation, Escape to close, and Enter to select.Mouse
: Capture mouse events to close the menu or select an itemBlur
: Trigger the DOM blur eventVisibility
: Set the visibility by toggling, setting to on, or setting to off.ContainerReceiver
: Update the component on newInput
when the parent re-renders.
Constructors
Highlight Target a
Select Int a
Key KeyboardEvent a
Mouse MouseState a
Blur a
Visibility VisibilityStatus a
ReplaceItems (Array item) a
Raise (o Unit) a
ContainerReceiver (ContainerInput o item) a
#ContainerState Source
type ContainerState item = { highlightedIndex :: Maybe Int, items :: Array item, lastIndex :: Int, mouseDown :: Boolean, open :: Boolean }
The internal state of the Container
primitive
items
: An array of items held within theContainer
open
: Whether theContainer
is visiblehighlightedIndex
: The index of the highlighted item, if one existslastIndex
: The index of the last item in theContainer
mouseDown
: Whether the mouse is clicked or not
#ContainerInput Source
type ContainerInput o item = { items :: Array item, render :: ContainerState item -> ComponentHTML (ContainerQuery o item) }
The input type of the Container
primitive
items
: The initial value ofitems
in theContainerState
render
: Therender
function for theContainer
primitive
#Message Source
data Message o item
The Container sends the parent messages in two instances:
Emit
: An embedded query has been triggered, and you must decide how to handle it; typically via evaluating in the parent or re-routing the query to another primitive.ItemSelected
: An item has been selected from the container.
Constructors
ItemSelected item
Emit (o Unit)
#component Source
component :: forall e o item. Component HTML (ContainerQuery o item) (ContainerInput o item) (Message o item) (FX e)
The primitive handles state and transformations but defers all rendering to the parent. The
render function can be written using our helper functions to ensure the right events are included. See the Dispatch
module for more information.
#getToggleProps Source
getToggleProps :: forall f e item o. (ContainerQuery o item Unit -> Unit -> f Unit) -> Array (IProp (onBlur :: FocusEvent, onClick :: MouseEvent, onKeyDown :: KeyboardEvent, onMouseDown :: MouseEvent, onMouseUp :: MouseEvent, tabIndex :: Int | e) f) -> Array (IProp (onBlur :: FocusEvent, onClick :: MouseEvent, onKeyDown :: KeyboardEvent, onMouseDown :: MouseEvent, onMouseUp :: MouseEvent, tabIndex :: Int | e) f)
Intended for use on a clickable toggle to show/hide the Container
primitive. If
you are using a text field to manage the container, use getInputProps
instead.
#getChildProps Source
getChildProps :: forall e item o. Array (IProp (onBlur :: FocusEvent, tabIndex :: Int | e) (ContainerQuery o item)) -> Array (IProp (onBlur :: FocusEvent, tabIndex :: Int | e) (ContainerQuery o item))
Intended to allow you to embed whatever you want into the container
#getContainerProps Source
getContainerProps :: forall e item o. Array (IProp (onBlur :: FocusEvent, onMouseDown :: MouseEvent, onMouseUp :: MouseEvent, tabIndex :: Int | e) (ContainerQuery o item)) -> Array (IProp (onBlur :: FocusEvent, onMouseDown :: MouseEvent, onMouseUp :: MouseEvent, tabIndex :: Int | e) (ContainerQuery o item))
Intended to be used on the container primitive to capture key, click, highlighting, and other events
#getItemProps Source
getItemProps :: forall e item o. Int -> Array (IProp (onBlur :: FocusEvent, onClick :: MouseEvent, onKeyDown :: KeyboardEvent, onMouseOver :: MouseEvent, tabIndex :: Int | e) (ContainerQuery o item)) -> Array (IProp (onBlur :: FocusEvent, onClick :: MouseEvent, onKeyDown :: KeyboardEvent, onMouseOver :: MouseEvent, tabIndex :: Int | e) (ContainerQuery o item))
Intended to be used on items inside the container