mirror of
https://github.com/NoRedInk/noredink-ui.git
synced 2024-12-25 22:53:34 +03:00
Merge branch 'master' into raven/biggify-more-icons
This commit is contained in:
commit
23ff232ae5
@ -4,7 +4,11 @@ module Nri.Ui.SegmentedControl.V13 exposing
|
||||
, Positioning(..), Width(..)
|
||||
)
|
||||
|
||||
{-| Changes from V12:
|
||||
{-| Post-release patches:
|
||||
|
||||
- Fixes <https://github.com/NoRedInk/noredink-ui/issues/608>
|
||||
|
||||
Changes from V12:
|
||||
|
||||
- Adds tooltip support
|
||||
- combine onFocus and onSelect into focusAndSelect msg handler (for tooltips)
|
||||
@ -176,7 +180,13 @@ view config =
|
||||
{ id = option.value
|
||||
, idString = option.idString
|
||||
, tabAttributes = option.attributes
|
||||
, tabTooltip = option.tabTooltip
|
||||
, tabTooltip =
|
||||
case config.positioning of
|
||||
Left FillContainer ->
|
||||
Tooltip.containerCss [ Css.width (Css.pct 100) ] :: option.tabTooltip
|
||||
|
||||
_ ->
|
||||
option.tabTooltip
|
||||
, tabView = [ viewIcon option.icon, option.label ]
|
||||
, panelView = option.content
|
||||
, spaHref = Maybe.map (\toUrl -> toUrl option.value) config.toUrl
|
||||
@ -234,15 +244,16 @@ styles positioning numEntries index isSelected =
|
||||
|
||||
else
|
||||
unFocusedSegmentStyles
|
||||
, case positioning of
|
||||
Left FitContent ->
|
||||
Css.batch []
|
||||
, Css.batch <|
|
||||
case positioning of
|
||||
Left FillContainer ->
|
||||
[ width (Css.pct 100)
|
||||
, flexGrow (int 1)
|
||||
, textAlign center
|
||||
]
|
||||
|
||||
Left FillContainer ->
|
||||
expandingTabStyles
|
||||
|
||||
Center ->
|
||||
Css.batch []
|
||||
_ ->
|
||||
[]
|
||||
]
|
||||
|
||||
|
||||
@ -297,11 +308,3 @@ unFocusedSegmentStyles =
|
||||
, hover [ backgroundColor Colors.frost ]
|
||||
]
|
||||
|> Css.batch
|
||||
|
||||
|
||||
expandingTabStyles : Style
|
||||
expandingTabStyles =
|
||||
[ flexGrow (int 1)
|
||||
, textAlign center
|
||||
]
|
||||
|> Css.batch
|
||||
|
@ -8,7 +8,7 @@ module Nri.Ui.Tooltip.V2 exposing
|
||||
, smallPadding, normalPadding, customPadding
|
||||
, onClick, onHover
|
||||
, open
|
||||
, css, custom, customTriggerAttributes
|
||||
, css, custom, customTriggerAttributes, containerCss
|
||||
, primaryLabel, auxillaryDescription
|
||||
)
|
||||
|
||||
@ -17,6 +17,11 @@ module Nri.Ui.Tooltip.V2 exposing
|
||||
- tooltips with focusable content (e.g., a link) will not handle focus correctly for
|
||||
keyboard-only users when using the onHover attribute
|
||||
|
||||
Post-release patches:
|
||||
|
||||
- mark customTriggerAttributes as deprecated
|
||||
- add containerCss
|
||||
|
||||
Changes from V1:
|
||||
|
||||
- {Position, withPosition} -> {onTop, onBottom, onLeft, onRight}
|
||||
@ -60,7 +65,7 @@ Example usage:
|
||||
@docs smallPadding, normalPadding, customPadding
|
||||
@docs onClick, onHover
|
||||
@docs open
|
||||
@docs css, custom, customTriggerAttributes
|
||||
@docs css, custom, customTriggerAttributes, containerCss
|
||||
@docs primaryLabel, auxillaryDescription
|
||||
|
||||
-}
|
||||
@ -95,6 +100,7 @@ type alias Tooltip msg =
|
||||
, alignment : Alignment
|
||||
, content : List (Html msg)
|
||||
, attributes : List (Html.Attribute Never)
|
||||
, containerStyles : List Style
|
||||
, tooltipStyleOverrides : List Style
|
||||
, width : Width
|
||||
, padding : Padding
|
||||
@ -114,6 +120,12 @@ buildAttributes =
|
||||
, alignment = Middle
|
||||
, content = []
|
||||
, attributes = []
|
||||
, containerStyles =
|
||||
[ Css.boxSizing Css.borderBox
|
||||
, Css.display Css.inlineBlock
|
||||
, Css.textAlign Css.left
|
||||
, Css.position Css.relative
|
||||
]
|
||||
, tooltipStyleOverrides = []
|
||||
, width = Exactly 320
|
||||
, padding = NormalPadding
|
||||
@ -276,18 +288,19 @@ custom attributes =
|
||||
Attribute (\config -> { config | attributes = config.attributes ++ attributes })
|
||||
|
||||
|
||||
{-| Use this helper to add custom attributes to the tooltip trigger.
|
||||
|
||||
Do NOT use this helper to add css styles, as they may not be applied the way
|
||||
you want/expect if underlying styles change.
|
||||
Instead, please use the `css` helper.
|
||||
|
||||
{-| DEPRECATED -- a future release will remove this helper.
|
||||
-}
|
||||
customTriggerAttributes : List (Html.Attribute msg) -> Attribute msg
|
||||
customTriggerAttributes attributes =
|
||||
Attribute (\config -> { config | triggerAttributes = config.triggerAttributes ++ attributes })
|
||||
|
||||
|
||||
{-| -}
|
||||
containerCss : List Style -> Attribute msg
|
||||
containerCss styles =
|
||||
Attribute (\config -> { config | containerStyles = config.containerStyles ++ styles })
|
||||
|
||||
|
||||
{-| Should the tooltip be exactly some measurement or fit to the width of the
|
||||
content?
|
||||
-}
|
||||
@ -467,14 +480,14 @@ viewTooltip_ :
|
||||
}
|
||||
-> Tooltip msg
|
||||
-> Html msg
|
||||
viewTooltip_ { trigger, id } tooltip_ =
|
||||
viewTooltip_ { trigger, id } tooltip =
|
||||
let
|
||||
( containerEvents, buttonEvents ) =
|
||||
case tooltip_.trigger of
|
||||
case tooltip.trigger of
|
||||
Just (OnClick msg) ->
|
||||
( []
|
||||
, [ EventExtras.onClickStopPropagation
|
||||
(msg (not tooltip_.isOpen))
|
||||
(msg (not tooltip.isOpen))
|
||||
]
|
||||
)
|
||||
|
||||
@ -496,17 +509,13 @@ viewTooltip_ { trigger, id } tooltip_ =
|
||||
in
|
||||
Nri.Ui.styled Root.div
|
||||
"Nri-Ui-Tooltip-V2"
|
||||
[ Css.boxSizing Css.borderBox
|
||||
, Css.display Css.inlineBlock
|
||||
, Css.textAlign Css.left
|
||||
, Css.position Css.relative
|
||||
]
|
||||
tooltip.containerStyles
|
||||
containerEvents
|
||||
[ Html.div
|
||||
[]
|
||||
[ trigger
|
||||
([ if tooltip_.isOpen then
|
||||
case tooltip_.purpose of
|
||||
([ if tooltip.isOpen then
|
||||
case tooltip.purpose of
|
||||
PrimaryLabel ->
|
||||
Aria.labeledBy id
|
||||
|
||||
@ -521,15 +530,15 @@ viewTooltip_ { trigger, id } tooltip_ =
|
||||
Attributes.property "data-closed-tooltip" Encode.null
|
||||
]
|
||||
++ buttonEvents
|
||||
++ tooltip_.triggerAttributes
|
||||
++ tooltip.triggerAttributes
|
||||
)
|
||||
, hoverBridge tooltip_
|
||||
, hoverBridge tooltip
|
||||
]
|
||||
, viewOverlay tooltip_
|
||||
, viewOverlay tooltip
|
||||
|
||||
-- Popout is rendered after the overlay, to allow client code to give it
|
||||
-- priority when clicking by setting its position
|
||||
, viewTooltip (Just id) tooltip_
|
||||
, viewTooltip (Just id) tooltip
|
||||
]
|
||||
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user