Merge branch 'master' into phx-1315-add-tooltip-option-to-capture-mou…

…se-events
NoRedInk · Dec 21, 2023 · 01dc847 · 01dc847
2 parents 3eb05d2 + 7734b7b
commit 01dc847
Show file tree

Hide file tree

Showing 12 changed files with 462 additions and 21 deletions.
diff --git a/component-catalog/src/Examples/Accordion.elm b/component-catalog/src/Examples/Accordion.elm
@@ -23,7 +23,7 @@ import EllieLink
 import Example exposing (Example)
 import Html.Styled.Attributes as Attributes exposing (css, src)
 import KeyboardSupport exposing (Key(..))
-import Nri.Ui.Accordion.V3 as Accordion exposing (AccordionEntry(..))
+import Nri.Ui.Accordion.V4 as Accordion exposing (AccordionEntry(..))
 import Nri.Ui.Colors.Extra as ColorsExtra
 import Nri.Ui.Colors.V1 as Colors
 import Nri.Ui.FocusRing.V1 as FocusRing
@@ -43,7 +43,7 @@ moduleName =
 
 version : Int
 version =
-    3
+    4
 
 
 {-| -}
@@ -120,6 +120,7 @@ view ellieLinkConfig model =
                                                         [ ( "caret", Tuple.first settings.icon )
                                                         , ( "content", Code.anonymousFunction "()" (Tuple.first settings.content) )
                                                         , ( "entryClass", Code.string "customizable-example" )
+                                                        , ( "expansionDirection", Tuple.first settings.expansionDirection )
                                                         , ( "headerContent", Tuple.first settings.headerContent )
                                                         , ( "headerId", Code.string "customizable-example-header" )
                                                         , ( "headerLevel", Code.fromModule moduleName "H3" )
@@ -163,6 +164,7 @@ view ellieLinkConfig model =
                 { caret = Tuple.second settings_.icon
                 , content = \() -> Tuple.second settings_.content
                 , entryClass = "customizable-example"
+                , expansionDirection = Tuple.second settings_.expansionDirection
                 , headerContent = Tuple.second settings_.headerContent
                 , headerId = "customizable-example-header"
                 , headerLevel = Accordion.H3
@@ -174,6 +176,7 @@ view ellieLinkConfig model =
                 { caret = Accordion.defaultCaret
                 , content = \_ -> Html.text "🍎 There are many kinds of apples! Apples are more genetically diverse than humans. The genetic diversity of apples means that to preserve delicious apple varieties, growers must use grafting rather than seeds. In the apple market, clones have already taken over! 🍏"
                 , entryClass = "accordion-example"
+                , expansionDirection = Accordion.Downwards
                 , headerContent = Html.text "Apples (has children)"
                 , headerId = "accordion-entry__1"
                 , headerLevel = Accordion.H3
@@ -193,6 +196,7 @@ view ellieLinkConfig model =
                                     [ Html.text "Wikipedia article on Gala Apples" ]
                                 ]
                     , entryClass = "accordion-example-child"
+                    , expansionDirection = Accordion.Downwards
                     , headerContent = Html.text "Gala"
                     , headerId = "accordion-entry__11"
                     , headerLevel = Accordion.H4
@@ -213,6 +217,7 @@ view ellieLinkConfig model =
                                     [ Html.text "Wikipedia article on Granny Smith Apples" ]
                                 ]
                     , entryClass = "accordion-example-child"
+                    , expansionDirection = Accordion.Downwards
                     , headerContent = Html.text "Granny Smith"
                     , headerId = "accordion-entry__12"
                     , headerLevel = Accordion.H4
@@ -233,6 +238,7 @@ view ellieLinkConfig model =
                                     [ Html.text "Wikipedia article on Fuji Apples" ]
                                 ]
                     , entryClass = "accordion-example-child"
+                    , expansionDirection = Accordion.Downwards
                     , headerContent = Html.text "Fuji"
                     , headerId = "accordion-entry__13"
                     , headerLevel = Accordion.H4
@@ -242,10 +248,11 @@ view ellieLinkConfig model =
                     []
                 ]
             , AccordionEntry
-                { caret = Accordion.defaultCaret
+                { caret = Accordion.upwardCaret
                 , content = \_ -> Html.text "🍊 I don't know anything about oranges! Except: YUM! 🍊"
                 , entryClass = "accordion-example"
-                , headerContent = Html.text "Oranges"
+                , expansionDirection = Accordion.Upwards
+                , headerContent = Html.text "Oranges (upward accordion)"
                 , headerId = "accordion-entry__2"
                 , headerLevel = Accordion.H3
                 , isExpanded = Set.member 2 model.expanded
@@ -277,6 +284,7 @@ view ellieLinkConfig model =
                                 [ Html.img "Wild Apple" [ src "https://upload.wikimedia.org/wikipedia/commons/9/92/95apple.jpeg" ] ]
                             ]
                 , entryClass = "fixed-positioning-accordion-example"
+                , expansionDirection = Accordion.Downwards
                 , headerContent = Html.text "Advanced Example: Expand & Scroll!"
                 , headerId = "accordion-entry__6"
                 , headerLevel = Accordion.H3
@@ -348,6 +356,7 @@ type alias State =
 
 type alias Settings =
     { icon : ( String, Bool -> Html Msg )
+    , expansionDirection : ( String, Accordion.ExpansionDirection )
     , headerContent : ( String, Html Msg )
     , content : ( String, Html Msg )
     }
@@ -357,6 +366,7 @@ initSettings : Control Settings
 initSettings =
     Control.record Settings
         |> Control.field "icon" controlIcon
+        |> Control.field "expansionDirection" controlExpansionDirection
         |> Control.field "headerContent" controlHeaderContent
         |> Control.field "content" controlContent
 
@@ -367,6 +377,9 @@ controlIcon =
         [ ( "defaultCaret"
           , Control.value ( "Accordion.defaultCaret", Accordion.defaultCaret )
           )
+        , ( "upwardCaret"
+          , Control.value ( "Accordion.upwardCaret", Accordion.upwardCaret )
+          )
         , ( "none", Control.value ( "\\_ -> text \"\"", \_ -> Html.text "" ) )
         , ( "UiIcon"
           , Control.map
@@ -403,6 +416,18 @@ controlHeaderContent =
         (Control.string "Berries")
 
 
+controlExpansionDirection : Control ( String, Accordion.ExpansionDirection )
+controlExpansionDirection =
+    Control.choice
+        [ ( "Downwards"
+          , Control.value ( "Accordion.Downwards", Accordion.Downwards )
+          )
+        , ( "Upwards"
+          , Control.value ( "Accordion.Upwards", Accordion.Upwards )
+          )
+        ]
+
+
 controlContent : Control ( String, Html Msg )
 controlContent =
     Control.map

diff --git a/component-catalog/src/Examples/FocusRing.elm b/component-catalog/src/Examples/FocusRing.elm
@@ -13,7 +13,7 @@ import Example exposing (Example)
 import Html.Styled as Html exposing (..)
 import Html.Styled.Attributes exposing (css, href)
 import Markdown
-import Nri.Ui.Accordion.V3 as Accordion exposing (AccordionEntry(..))
+import Nri.Ui.Accordion.V4 as Accordion exposing (AccordionEntry(..))
 import Nri.Ui.Button.V10 as Button
 import Nri.Ui.Checkbox.V7 as Checkbox
 import Nri.Ui.ClickableSvg.V2 as ClickableSvg
@@ -248,6 +248,7 @@ NOTE: use `boxShadows` instead if your focusable element:
                             { caret = Accordion.defaultCaret
                             , content = \() -> text "Content"
                             , entryClass = "accordion-focus-ring"
+                            , expansionDirection = Accordion.Downwards
                             , headerContent = text "Accordion"
                             , headerId = "accordion-focus-ring-example-header"
                             , headerLevel = Accordion.H3

diff --git a/component-catalog/src/Examples/UiIcon.elm b/component-catalog/src/Examples/UiIcon.elm
@@ -197,7 +197,7 @@ all =
         , ( "star", UiIcon.star, [] )
         , ( "starFilled", UiIcon.starFilled, [] )
         , ( "starOutline", UiIcon.starOutline, [] )
-        , ( "no", UiIcon.no, [])
+        , ( "no", UiIcon.no, [] )
         ]
       )
     , ( "Badges & Celebration"

diff --git a/deprecated-modules.csv b/deprecated-modules.csv
@@ -1,3 +1,4 @@
+Nri.Ui.Accordion.V3,upgrade to V4
 Nri.Ui.Block.V4,upgrade to V6
 Nri.Ui.Block.V5,upgrade to V6
 Nri.Ui.Carousel.V1,upgrade to V2

diff --git a/elm.json b/elm.json
@@ -3,13 +3,14 @@
     "name": "NoRedInk/noredink-ui",
     "summary": "UI Widgets we use at NRI",
     "license": "BSD-3-Clause",
-    "version": "27.4.1",
+    "version": "27.5.0",
     "exposed-modules": [
         "Browser.Events.Extra",
         "Nri.Test.KeyboardHelpers.V1",
         "Nri.Test.MouseHelpers.V1",
         "Nri.Ui",
         "Nri.Ui.Accordion.V3",
+        "Nri.Ui.Accordion.V4",
         "Nri.Ui.AnimatedIcon.V1",
         "Nri.Ui.AssignmentIcon.V2",
         "Nri.Ui.Balloon.V2",

diff --git a/forbidden-imports.toml b/forbidden-imports.toml
@@ -38,6 +38,9 @@ usages = ['component-catalog-app/../src/Nri/Ui/Button/V8.elm']
 [forbidden."Nri.Ui.Accordion.V1"]
 hint = 'upgrade to V3'
 
+[forbidden."Nri.Ui.Accordion.V3"]
+hint = 'upgrade to V4'
+
 [forbidden."Nri.Ui.Balloon.V1"]
 hint = 'upgrade to V2'