mirror of
https://github.com/NoRedInk/noredink-ui.git
synced 2024-12-20 12:11:32 +03:00
add back in showPennant
This commit is contained in:
parent
e18a25154b
commit
f4d74032d4
@ -4,7 +4,7 @@ module Nri.Ui.RadioButton.V3 exposing
|
|||||||
, value, selectedValue, valueToString
|
, value, selectedValue, valueToString
|
||||||
, onSelect
|
, onSelect
|
||||||
, name
|
, name
|
||||||
, premium
|
, premium, showPennant
|
||||||
)
|
)
|
||||||
|
|
||||||
{-| Changes from V2:
|
{-| Changes from V2:
|
||||||
@ -16,7 +16,7 @@ module Nri.Ui.RadioButton.V3 exposing
|
|||||||
@docs value, selectedValue, valueToString
|
@docs value, selectedValue, valueToString
|
||||||
@docs onSelect
|
@docs onSelect
|
||||||
@docs name
|
@docs name
|
||||||
@docs premium
|
@docs premium, showPennant
|
||||||
|
|
||||||
-}
|
-}
|
||||||
|
|
||||||
@ -35,7 +35,7 @@ import Nri.Ui.Colors.V1 as Colors
|
|||||||
import Nri.Ui.Data.PremiumLevel as PremiumLevel exposing (PremiumLevel)
|
import Nri.Ui.Data.PremiumLevel as PremiumLevel exposing (PremiumLevel)
|
||||||
import Nri.Ui.Fonts.V1 as Fonts
|
import Nri.Ui.Fonts.V1 as Fonts
|
||||||
import Nri.Ui.Html.Attributes.V2 as Attributes
|
import Nri.Ui.Html.Attributes.V2 as Attributes
|
||||||
import Nri.Ui.Html.V3 exposing (viewIf)
|
import Nri.Ui.Html.V3 exposing (viewJust)
|
||||||
import Nri.Ui.Pennant.V2 as Pennant
|
import Nri.Ui.Pennant.V2 as Pennant
|
||||||
import Nri.Ui.Svg.V1 exposing (Svg, fromHtml)
|
import Nri.Ui.Svg.V1 exposing (Svg, fromHtml)
|
||||||
import String exposing (toLower)
|
import String exposing (toLower)
|
||||||
@ -106,6 +106,13 @@ premium { teacherPremiumLevel, contentPremiumLevel } =
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
{-| Show the pennant and attach this onClick handler
|
||||||
|
-}
|
||||||
|
showPennant : msg -> Attribute value msg
|
||||||
|
showPennant premiumMsg =
|
||||||
|
Attribute { emptyEventsAndValues | premiumMsg = Just premiumMsg } identity
|
||||||
|
|
||||||
|
|
||||||
{-| Customizations for the RadioButton.
|
{-| Customizations for the RadioButton.
|
||||||
-}
|
-}
|
||||||
type Attribute value msg
|
type Attribute value msg
|
||||||
@ -192,20 +199,14 @@ view :
|
|||||||
-> Html msg
|
-> Html msg
|
||||||
view label =
|
view label =
|
||||||
internalView
|
internalView
|
||||||
{ label = label
|
{ label = label }
|
||||||
, premiumMsg = Nothing
|
|
||||||
, showPennant = False
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
type alias InternalConfig msg =
|
type alias InternalConfig =
|
||||||
{ label : String
|
{ label : String }
|
||||||
, premiumMsg : Maybe msg
|
|
||||||
, showPennant : Bool
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
internalView : InternalConfig msg -> List (Attribute value msg) -> Html msg
|
internalView : InternalConfig -> List (Attribute value msg) -> Html msg
|
||||||
internalView config attributes =
|
internalView config attributes =
|
||||||
let
|
let
|
||||||
isChecked =
|
isChecked =
|
||||||
@ -237,6 +238,14 @@ internalView config attributes =
|
|||||||
|
|
||||||
_ ->
|
_ ->
|
||||||
False
|
False
|
||||||
|
|
||||||
|
showPennant_ =
|
||||||
|
case eventsAndValues.premiumMsg of
|
||||||
|
Just _ ->
|
||||||
|
True
|
||||||
|
|
||||||
|
_ ->
|
||||||
|
False
|
||||||
in
|
in
|
||||||
case unvalidatedRadioConfig of
|
case unvalidatedRadioConfig of
|
||||||
( Just value_, Just name_, Just valueToString_ ) ->
|
( Just value_, Just name_, Just valueToString_ ) ->
|
||||||
@ -246,7 +255,7 @@ internalView config attributes =
|
|||||||
in
|
in
|
||||||
Html.span
|
Html.span
|
||||||
[ id (id_ ++ "-container")
|
[ id (id_ ++ "-container")
|
||||||
, classList [ ( "Nri-RadioButton-PremiumClass", config.showPennant ) ]
|
, classList [ ( "Nri-RadioButton-PremiumClass", showPennant_ ) ]
|
||||||
, css
|
, css
|
||||||
[ position relative
|
[ position relative
|
||||||
, marginLeft (px -4)
|
, marginLeft (px -4)
|
||||||
@ -312,7 +321,7 @@ internalView config attributes =
|
|||||||
, isChecked = isChecked
|
, isChecked = isChecked
|
||||||
}
|
}
|
||||||
, span
|
, span
|
||||||
(if config.showPennant then
|
(if showPennant_ then
|
||||||
[ css
|
[ css
|
||||||
[ displayFlex
|
[ displayFlex
|
||||||
, alignItems center
|
, alignItems center
|
||||||
@ -324,18 +333,17 @@ internalView config attributes =
|
|||||||
[ css [ verticalAlign middle ] ]
|
[ css [ verticalAlign middle ] ]
|
||||||
)
|
)
|
||||||
[ Html.text config.label
|
[ Html.text config.label
|
||||||
, viewIf
|
, viewJust
|
||||||
(\() ->
|
(\premiumMsg ->
|
||||||
ClickableSvg.button "Premium"
|
ClickableSvg.button "Premium"
|
||||||
Pennant.premiumFlag
|
Pennant.premiumFlag
|
||||||
[ Maybe.map ClickableSvg.onClick config.premiumMsg
|
[ ClickableSvg.onClick premiumMsg
|
||||||
|> Maybe.withDefault (ClickableSvg.custom [])
|
|
||||||
, ClickableSvg.exactWidth 26
|
, ClickableSvg.exactWidth 26
|
||||||
, ClickableSvg.exactHeight 24
|
, ClickableSvg.exactHeight 24
|
||||||
, ClickableSvg.css [ marginLeft (px 8) ]
|
, ClickableSvg.css [ marginLeft (px 8) ]
|
||||||
]
|
]
|
||||||
)
|
)
|
||||||
config.showPennant
|
eventsAndValues.premiumMsg
|
||||||
]
|
]
|
||||||
]
|
]
|
||||||
]
|
]
|
||||||
|
@ -114,6 +114,7 @@ viewVanilla state =
|
|||||||
, RadioButton.selectedValue state.selectedValue
|
, RadioButton.selectedValue state.selectedValue
|
||||||
, RadioButton.onSelect Select
|
, RadioButton.onSelect Select
|
||||||
, RadioButton.valueToString selectionToString
|
, RadioButton.valueToString selectionToString
|
||||||
|
, RadioButton.showPennant <| OpenModal ""
|
||||||
]
|
]
|
||||||
]
|
]
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user