mirror of
https://github.com/NoRedInk/noredink-ui.git
synced 2024-11-30 14:48:09 +03:00
Change api to use lastId. Revert change of behaviour for now
Fix examples with control to be disclosure
This commit is contained in:
parent
b8c04eeef5
commit
1722204874
@ -105,7 +105,7 @@ type alias MenuConfig msg =
|
|||||||
, menuId : String
|
, menuId : String
|
||||||
, zIndex : Int
|
, zIndex : Int
|
||||||
, opensOnHover : Bool
|
, opensOnHover : Bool
|
||||||
, disclosure : Bool
|
, purpose : Purpose
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@ -117,6 +117,11 @@ type alias ButtonConfig =
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
type Purpose
|
||||||
|
= NavMenu
|
||||||
|
| Disclosure { lastId : Maybe String }
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
-- Generators for ButtonAttribute
|
-- Generators for ButtonAttribute
|
||||||
|
|
||||||
@ -202,11 +207,21 @@ opensOnHover value =
|
|||||||
Attribute <| \config -> { config | opensOnHover = value }
|
Attribute <| \config -> { config | opensOnHover = value }
|
||||||
|
|
||||||
|
|
||||||
{-| Whether the menu contains a form when opened. This affects how Tab key behaves Defaults to `False`.
|
{-| Makes the menu behave as a disclosure.
|
||||||
|
|
||||||
|
For more information, please read [Disclosure (Show/Hide) pattern](https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/).
|
||||||
|
|
||||||
|
You will need to pass in the last focusable element in the disclosed content in order for:
|
||||||
|
|
||||||
|
- any focusable elements in the disclosed content to be keyboard accessible
|
||||||
|
- the disclosure to close appropriately when the user tabs past all of the disclosed content
|
||||||
|
|
||||||
|
You may pass a lastId of Nothing if there is NO focusable content within the disclosure.
|
||||||
|
|
||||||
-}
|
-}
|
||||||
disclosure : Bool -> Attribute msg
|
disclosure : { lastId : Maybe String } -> Attribute msg
|
||||||
disclosure value =
|
disclosure exitFocusManager =
|
||||||
Attribute <| \config -> { config | disclosure = value }
|
Attribute (\config -> { config | purpose = Disclosure exitFocusManager })
|
||||||
|
|
||||||
|
|
||||||
{-| Menu/pulldown configuration:
|
{-| Menu/pulldown configuration:
|
||||||
@ -234,7 +249,7 @@ view attributes config =
|
|||||||
, menuId = ""
|
, menuId = ""
|
||||||
, zIndex = 1
|
, zIndex = 1
|
||||||
, opensOnHover = False
|
, opensOnHover = False
|
||||||
, disclosure = False
|
, purpose = NavMenu
|
||||||
}
|
}
|
||||||
|
|
||||||
menuConfig =
|
menuConfig =
|
||||||
@ -430,24 +445,19 @@ viewCustom config =
|
|||||||
, focus = Just config.buttonId
|
, focus = Just config.buttonId
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
:: (if config.disclosure then
|
:: [ Key.tab
|
||||||
[]
|
(config.focusAndToggle
|
||||||
|
{ isOpen = False
|
||||||
else
|
, focus = Nothing
|
||||||
[ Key.tab
|
}
|
||||||
(config.focusAndToggle
|
)
|
||||||
{ isOpen = False
|
, Key.tabBack
|
||||||
, focus = Nothing
|
(config.focusAndToggle
|
||||||
}
|
{ isOpen = False
|
||||||
)
|
, focus = Nothing
|
||||||
, Key.tabBack
|
}
|
||||||
(config.focusAndToggle
|
)
|
||||||
{ isOpen = False
|
]
|
||||||
, focus = Nothing
|
|
||||||
}
|
|
||||||
)
|
|
||||||
]
|
|
||||||
)
|
|
||||||
)
|
)
|
||||||
:: styleContainer
|
:: styleContainer
|
||||||
)
|
)
|
||||||
|
@ -250,12 +250,12 @@ view ellieLinkConfig state =
|
|||||||
button buttonAttributes [ text "Custom Menu trigger button" ]
|
button buttonAttributes [ text "Custom Menu trigger button" ]
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
, ( "Menu.button (with controls)"
|
, ( "Menu.button (with Menu.disclosure)"
|
||||||
, Menu.view
|
, Menu.view
|
||||||
(menuAttributes
|
(menuAttributes
|
||||||
++ List.filterMap identity
|
++ [ Menu.buttonId "with_controls__button"
|
||||||
[ Just <| Menu.buttonId "with_controls__button"
|
, Menu.menuId "with_controls__menu"
|
||||||
, Just <| Menu.menuId "with_controls__menu"
|
, Menu.disclosure { lastId = Nothing }
|
||||||
]
|
]
|
||||||
)
|
)
|
||||||
{ isOpen = isOpen "with_controls"
|
{ isOpen = isOpen "with_controls"
|
||||||
@ -321,7 +321,6 @@ controlMenuAttributes =
|
|||||||
|> ControlExtra.optionalBoolListItem "isDisabled" ( "Menu.isDisabled True", Menu.isDisabled True )
|
|> ControlExtra.optionalBoolListItem "isDisabled" ( "Menu.isDisabled True", Menu.isDisabled True )
|
||||||
|> ControlExtra.optionalListItem "menuWidth" controlMenuWidth
|
|> ControlExtra.optionalListItem "menuWidth" controlMenuWidth
|
||||||
|> ControlExtra.optionalBoolListItem "opensOnHover" ( "Menu.opensOnHover True", Menu.opensOnHover True )
|
|> ControlExtra.optionalBoolListItem "opensOnHover" ( "Menu.opensOnHover True", Menu.opensOnHover True )
|
||||||
|> ControlExtra.optionalBoolListItem "disclosure" ( "Menu.disclosure True", Menu.disclosure True )
|
|
||||||
|
|
||||||
|
|
||||||
controlAlignment : Control ( String, Menu.Attribute msg )
|
controlAlignment : Control ( String, Menu.Attribute msg )
|
||||||
|
Loading…
Reference in New Issue
Block a user