cdevienne/elm-orus-ui/1.0.0

Renamed to orus-io/elm-orus-ui. It is published under that name, and new versions come out there.

Versions published as cdevienne/elm-orus-ui still install under that name. 1 version of 1 come from the new location (see their notes).

Rerouted (renamed, needs approval). The GitHub user or repository was renamed. The tag is still there, at the new name. The Lamdera package server serves a copy recovered from https://github.com/orus-io/elm-orus-ui.

What we checked: The repo moved to github.com/orus-io/elm-orus-ui and tag 1.0.0 is there; its commit ad645724a38d is from 2024-11-15 10:17 UTC, after the version was published (2024-11-15 09:57 UTC); elm.json differs from package.elm-lang.org's; the exposed modules match docs.json; the zip's SHA-1 is not the published one and nothing else confirms its contents.

We could not verify this copy against what was published, so the Lamdera compiler asks before using it (y/n). Without a terminal, as in CI, it stops with an error unless approved:

  • lamdera make --auto-approve-package-rerouting approves rerouted versions for that run,
  • LAMDERA_AUTO_APPROVE_PACKAGE_REROUTING=1 does the same for every run in that environment,
  • LAMDERA_CACHE=off skips the Lamdera package server altogether: packages come from package.elm-lang.org and GitHub only, as with elm, and a rerouted version then fails to download.

Details · package.elm-lang.org's zip: https://github.com/cdevienne/elm-orus-ui/zipball/1.0.0/

OUI.MenuButton

A button+menu creation API

The button will open a menu when clicked.

type Align
= AlignTopLeft
| AlignTopRight
| AlignBottomRight
| AlignBottomLeft

Menu alignment

type Key
= ArrowDown
| ArrowUp
| Enter
| Esc

Keys

Constructor

new :
(Msg item msg -> msg)
-> (item -> msg)
-> Button { btnC | needOnClickOrDisabled : () } msg
-> Menu item msg
-> MenuButton btnC item msg

Creates a new button + menu

The button must not have any action defined on it

MenuButton.new (MenuButtonMsg "menu1")
    OnMenu1Click
    (Button.new "click me"
        |> Button.outlinedButton
    )
    (Menu.new identity
        |> Menu.withItems [ "One", "Two", "Three" ]
        |> Menu.withIcon
            (\i ->
                if i /= "Two" then
                    Just OUI.Icon.check


                else
                    Nothing
            )
    )
    |> OUI.Material.menuButton shared.theme model.menu1State []
alignLeft : MenuButton btnC item msg -> MenuButton btnC item msg

Change the menu alignment to 'left' (default)

alignRight : MenuButton btnC item msg -> MenuButton btnC item msg

Change the menu alignment to 'right'

alignTop : MenuButton btnC item msg -> MenuButton btnC item msg

Change the menu alignment to 'top'

alignBottom : MenuButton btnC item msg -> MenuButton btnC item msg

Change the menu alignment to 'bottom'

withOpenCloseIcons : Icon -> Icon -> MenuButton btnC item msg -> MenuButton btnC item msg

withOpenCloseIcons

State management

Menu + button is a stateful component

type alias State =
{ id : String
, opened : Bool
, highlighted : Int
}

The component state

type Msg item msg

The component message

init : String -> State

Initialise the State. The given id must be unique in the currently displayed components

update : Msg item msg -> State -> ( State, Cmd msg )

Update the state given a message

onOutsideClick : (Msg item msg -> msg) -> State -> Sub msg

Catch clicks outside an opened menu

update internals

If you need to change the update effect into something else than Cmd (say, a Effect, here is everything you need.

type Effect msg
= Loopback msg

Internal update returns Effect instead of Cmd

updateWithoutPerform : Msg item msg -> State -> ( State, Maybe (Effect msg) )

Do the update but returns a Effect instead of a Cmd

The Effect can be converted to a Cmd with performEffect

performEffect : Effect msg -> Cmd msg

Change a Effect into a Cmd

It simply does:

performEffect : Effect msg -> Cmd msg
performEffect (Loopback msg) =
    Task.perform identity <| Task.succeed msg

Internal

getButton : MenuButton btnC item msg -> Button { btnC | hasAction : () } msg

get the button

getMenu : MenuButton btnC item msg -> Menu item msg

get the menu

getMenuAlign : MenuButton btnC item msg -> Align

get the menu alignment

getOnKeyDown : MenuButton btnC item msg -> Key -> msg

get the keydown message

getOnLoseFocus : MenuButton btnC item msg -> msg

get the lose focus message

getOpenCloseIcons : MenuButton btnC item msg -> Maybe ( Icon, Icon )

get the open/close icons