nunntom/elm-ui-select
1
1
Fork 0
mirror of https://github.com/nunntom/elm-ui-select.git synced 2024-11-23 05:22:34 +03:00
Code Issues Packages Projects Releases Wiki Activity

Use viewport instead of element for menu

Browse Source
This commit is contained in:
Tom Nunn 2022-07-07 16:27:58 +02:00
parent 84ebb3051c
commit 672ddbae22
4 changed files with 14 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/Internal/Effect.elm
View File

@ -1,6 +1,6 @@
module Internal.Effect exposing (Effect(..), batch, none, perform)
import Browser.Dom as Dom exposing (Element)
import Browser.Dom as Dom
import Internal.Msg exposing (Msg(..))
import Process
import Task exposing (Task)
@ -49,7 +49,7 @@ perform tagger requestCmd effect =
Cmd.none
getContainerAndMenuElements : (Result Dom.Error { menu : Element, container : Element } -> msg) -> { containerId : String, menuId : String } -> Cmd msg
getContainerAndMenuElements : (Result Dom.Error { menu : Dom.Viewport, container : Dom.Element } -> msg) -> { containerId : String, menuId : String } -> Cmd msg
getContainerAndMenuElements msg { containerId, menuId } =
Task.map2
(\container menu ->
@ -58,7 +58,7 @@ getContainerAndMenuElements msg { containerId, menuId } =
}
)
(Dom.getElement containerId)
(Dom.getElement menuId)
(Dom.getViewportOf menuId)
|> Task.attempt msg

16
src/Internal/Model.elm
View File

@ -58,7 +58,7 @@ type alias InternalState a =
, highlighted : Int
, menuOpen : Bool
, containerElement : Maybe Dom.Element
, menuElement : Maybe Dom.Element
, menuViewPort : Maybe Dom.Viewport
, requestState : Maybe RequestState
, applyFilter : Bool
, focused : Bool
@ -79,7 +79,7 @@ init id =
, highlighted = 0
, menuOpen = False
, containerElement = Nothing
, menuElement = Nothing
, menuViewPort = Nothing
, requestState = Nothing
, applyFilter = False
, focused = False
@ -163,20 +163,20 @@ toOptionState (Model { highlighted, selected }) ( idx, a ) =
toMenuPlacement : Maybe Int -> Maybe Placement -> Model a -> Placement
toMenuPlacement maxHeight forcedPlacement (Model model) =
Maybe.map2 (calculateMenuDimensionsAndPlacement maxHeight forcedPlacement) model.containerElement model.menuElement
Maybe.map2 (calculateMenuDimensionsAndPlacement maxHeight forcedPlacement) model.containerElement model.menuViewPort
|> Maybe.map .placement
|> Maybe.withDefault Below
toMenuMinWidth : Model a -> Maybe Int
toMenuMinWidth (Model model) =
Maybe.map2 (calculateMenuDimensionsAndPlacement Nothing Nothing) model.containerElement model.menuElement
Maybe.map2 (calculateMenuDimensionsAndPlacement Nothing Nothing) model.containerElement model.menuViewPort
|> Maybe.map .minWidth
toMenuMaxHeight : Maybe Int -> Maybe Placement -> Model a -> Maybe Int
toMenuMaxHeight maxHeight forcedPlacement (Model model) =
Maybe.map2 (calculateMenuDimensionsAndPlacement maxHeight forcedPlacement) model.containerElement model.menuElement
Maybe.map2 (calculateMenuDimensionsAndPlacement maxHeight forcedPlacement) model.containerElement model.menuViewPort
|> Maybe.map .maxHeight
@ -275,11 +275,11 @@ clear (Model model) =
}
setElements : { container : Maybe Dom.Element, menu : Maybe Dom.Element } -> Model a -> Model a
setElements : { container : Maybe Dom.Element, menu : Maybe Dom.Viewport } -> Model a -> Model a
setElements { container, menu } (Model model) =
Model
{ model
| menuElement = menu
| menuViewPort = menu
, containerElement = container
}
@ -298,7 +298,7 @@ setFocused v (Model model) =
-- INTERNAL
calculateMenuDimensionsAndPlacement : Maybe Int -> Maybe Placement -> Dom.Element -> Dom.Element -> { minWidth : Int, maxHeight : Int, placement : Placement }
calculateMenuDimensionsAndPlacement : Maybe Int -> Maybe Placement -> Dom.Element -> Dom.Viewport -> { minWidth : Int, maxHeight : Int, placement : Placement }
calculateMenuDimensionsAndPlacement maxHeight forcedPlacement container menu =
calculateMenuDimensionsAndPlacementHelper
forcedPlacement

4
src/Internal/Msg.elm
View File

@ -1,6 +1,6 @@
module Internal.Msg exposing (Msg(..))
import Browser.Dom as Dom exposing (Element)
import Browser.Dom as Dom
import Internal.Option exposing (Option)
@ -12,7 +12,7 @@ type Msg a
| InputLostFocus
| MouseEnteredOption Int
| KeyDown (List (Option a)) String
| GotContainerAndMenuElements (Result Dom.Error { menu : Element, container : Element })
| GotContainerAndMenuElements (Result Dom.Error { menu : Dom.Viewport, container : Dom.Element })
| ClearButtonPressed
| InputDebounceReturned String
| GotRequestResponse String (Result () (List a))

2
src/Internal/Update.elm
View File

@ -72,7 +72,7 @@ update maybeRequest msg model =
( model
|> Model.setElements
{ container = Maybe.map .container (Result.toMaybe result)
, menu = Maybe.map .container (Result.toMaybe result)
, menu = Maybe.map .menu (Result.toMaybe result)
}
|> Model.openMenu
, Effect.none