jinjor/elm-contextmenu/1.1.0

elm-contextmenu

Flexible context menu for Elm (Demo)

How to use

This component works with The Elm Architecture.

type alias Model =
  { contextMenu : ContextMenu Context
  , config : ContextMenu.Config
  , message : String
  }

type Msg
  = ContextMenuMsg (ContextMenu.Msg Context)
  | Item Int

init : (Model, Cmd Msg)
init =
  let
    (contextMenu, msg) = ContextMenu.init
  in
    { contextMenu = contextMenu
    }
      ! [ Cmd.map ContextMenuMsg msg ]

update : Msg -> Model -> (Model, Cmd Msg)
update msg model =
  case msg of
    ContextMenuMsg msg ->
      let
        (contextMenu, cmd) =
          ContextMenu.update msg model.contextMenu
      in
        { model | contextMenu = contextMenu } ! [ Cmd.map ContextMenuMsg cmd ]

subscriptions : Model -> Sub Msg
subscriptions model =
  Sub.map ContextMenuMsg (ContextMenu.subscriptions model.contextMenu)

view : Model -> Html Msg
view model =
  div
    [ ContextMenu.open ContextMenuMsg "context1" ]
    [ ContextMenu.view
        ContextMenu.defaultConfig
        ContextMenuMsg
        toItemGroups
        toItemGroups model.contextMenu
    ]

toItemGroups : String -> List (List Item)
toItemGroups context =
  if context == "context1" then
    [ [ (ContextMenu.item "Hey", Item 1)
      , (ContextMenu.item "Yo!", Item 2)
      ]
    ]
  else
    []

License

BSD3