Begin adding example

styleguide-app/Examples/BreadCrumbs.elm

@@ -9,8 +9,12 @@ module Examples.BreadCrumbs exposing (example, State, Msg)
 import Accessibility.Styled exposing (..)
 import Category exposing (Category(..))
 import Css
+import Debug.Control as Control exposing (Control)
+import Debug.Control.Extra as ControlExtra
+import Debug.Control.View as ControlView
 import Example exposing (Example)
 import Html.Styled.Attributes exposing (css)
+import Nri.Ui.BreadCrumbs.V1 as BreadCrumbs exposing (BreadCrumb, BreadCrumbs)
 import Nri.Ui.Colors.V1 as Colors
 import Nri.Ui.Fonts.V1 as Fonts
 import Nri.Ui.Svg.V1 as Svg
@@ -20,23 +24,28 @@ import Nri.Ui.UiIcon.V1 as UiIcon
 
 {-| -}
 type alias State =
-    {}
+    Control Settings
 
 
-{-| -}
-type alias Msg =
-    ()
+moduleName : String
+moduleName =
+    "BreadCrumbs"
+
+
+version : Int
+version =
+    1
 
 
 {-| -}
 example : Example State Msg
 example =
-    { name = "BreadCrumbs"
-    , version = 1
+    { name = moduleName
+    , version = version
     , categories = [ Layout ]
     , keyboardSupport = []
-    , state = {}
-    , update = \_ m -> ( m, Cmd.none )
+    , state = init
+    , update = update
     , subscriptions = \_ -> Sub.none
     , preview =
         [ previewContainer [ previewText "🏠 Home" ]
@@ -44,8 +53,26 @@ example =
         , previewContainer [ previewText "🏠", previewArrowRight, previewText "🟠", previewArrowRight, previewText "🟣 Sub-Category " ]
         ]
     , view =
-        \ellieLinkConfig settings ->
-            [ Text.mediumBody [ Text.plaintext "🚧 Example coming soon! 🚧" ]
+        \ellieLinkConfig state ->
+            [ ControlView.view
+                { ellieLinkConfig = ellieLinkConfig
+                , name = moduleName
+                , version = version
+                , update = UpdateControl
+                , settings = state
+                , mainType = "RootHtml.Html msg"
+                , extraImports = []
+                , toExampleCode =
+                    \a ->
+                        -- TODO: implement
+                        -- List { sectionName : String, code : String }
+                        []
+                }
+            , BreadCrumbs.view
+                { aTagAttributes = \_ -> []
+                , isCurrentRoute = \_ -> False
+                }
+                (Control.currentValue state).breadCrumbs
             ]
     }
 
@@ -77,3 +104,42 @@ previewArrowRight =
         |> Svg.withWidth (Css.px 8)
         |> Svg.withCss [ Css.flexShrink Css.zero ]
         |> Svg.toHtml
+
+
+{-| -}
+type Msg
+    = UpdateControl (Control Settings)
+
+
+update : Msg -> State -> ( State, Cmd Msg )
+update msg state =
+    case msg of
+        UpdateControl control ->
+            ( control, Cmd.none )
+
+
+type alias Settings =
+    { breadCrumbs : BreadCrumbs ()
+    }
+
+
+init : Control Settings
+init =
+    Control.record Settings
+        |> Control.field "BreadCrumbs" controlBreadCrumbs
+
+
+controlBreadCrumbs : Control (BreadCrumbs ())
+controlBreadCrumbs =
+    Control.map BreadCrumbs.init controlBreadCrumb
+
+
+controlBreadCrumb : Control (BreadCrumb ())
+controlBreadCrumb =
+    Control.value
+        { icon = Nothing
+        , iconStyle = BreadCrumbs.Default
+        , id = "unique-id"
+        , text = "Home"
+        , route = ()
+        }