Paramaterize the gened code

styleguide-app/Examples/AssignmentIcon.elm

@@ -38,6 +38,7 @@ example =
             { label = "Planning Diagnostics"
             , name = "planningDiagnosticCircled"
             , icon = AssignmentIcon.planningDiagnosticCircled
+            , renderSvgCode = \name -> "AssignmentIcon." ++ name
             }
     , update = IconExamples.update
     , subscriptions = \_ -> Sub.none

styleguide-app/Examples/IconExamples.elm

@@ -58,12 +58,19 @@ type alias Settings =
     , icon : ( String, Svg )
     , label : String
     , showBorder : Bool
+    , renderSvgCode : String -> String
     }
 
 
 {-| -}
-init : { label : String, name : String, icon : Svg } -> Settings
-init { label, name, icon } =
+init :
+    { label : String
+    , name : String
+    , icon : Svg
+    , renderSvgCode : String -> String
+    }
+    -> Settings
+init { label, name, icon, renderSvgCode } =
     { showIconName = False
     , iconSelectorExpanded = False
     , color = fromCssColor Colors.greenDark
@@ -72,6 +79,7 @@ init { label, name, icon } =
     , icon = ( name, icon )
     , label = label
     , showBorder = True
+    , renderSvgCode = renderSvgCode
     }
 
 
@@ -362,7 +370,7 @@ viewResults state =
               , "\n\n\n"
               , "renderedSvg : Svg\n"
               , "renderedSvg =\n"
-              , "   UiIcon." ++ Tuple.first state.icon ++ "\n"
+              , "   " ++ state.renderSvgCode (Tuple.first state.icon) ++ "\n"
               , "       |> Svg.withColor color\n"
               , "       |> Svg.withWidth (Css.px " ++ String.fromFloat state.width ++ ")\n"
               , "       |> Svg.withHeight (Css.px " ++ String.fromFloat state.height ++ ")\n"

styleguide-app/Examples/Logo.elm

@@ -38,7 +38,13 @@ example =
     , version = 1
     , categories = [ Icons ]
     , keyboardSupport = []
-    , state = IconExamples.init { label = "NoRedInk", name = "noredink", icon = Logo.noredink }
+    , state =
+        IconExamples.init
+            { label = "NoRedInk"
+            , name = "noredink"
+            , icon = Logo.noredink
+            , renderSvgCode = \name -> "Logo." ++ name
+            }
     , update = IconExamples.update
     , subscriptions = \_ -> Sub.none
     , preview =

styleguide-app/Examples/Pennant.elm

@@ -34,7 +34,13 @@ example =
     , version = 2
     , categories = [ Icons ]
     , keyboardSupport = []
-    , state = IconExamples.init { label = "Premium", name = "premiumFlag", icon = Pennant.premiumFlag }
+    , state =
+        IconExamples.init
+            { label = "Premium"
+            , name = "premiumFlag"
+            , icon = Pennant.premiumFlag
+            , renderSvgCode = \name -> "Pennant." ++ name
+            }
     , update = IconExamples.update
     , subscriptions = \_ -> Sub.none
     , preview =

styleguide-app/Examples/Sprite.elm

@@ -34,7 +34,13 @@ example =
     , version = 1
     , categories = List.singleton Icons
     , keyboardSupport = []
-    , state = IconExamples.init { label = "Bold", name = "bold", icon = viewSprite Sprite.bold }
+    , state =
+        IconExamples.init
+            { label = "Bold"
+            , name = "bold"
+            , icon = viewSprite Sprite.bold
+            , renderSvgCode = \name -> "Svg.init \"\" [ Sprite.use  Sprite." ++ name ++ " ] "
+            }
     , update = IconExamples.update
     , subscriptions = \_ -> Sub.none
     , preview = IconExamples.preview (List.map Tuple.second sprites)

styleguide-app/Examples/UiIcon.elm

@@ -33,7 +33,13 @@ example =
     , version = 1
     , categories = List.singleton Icons
     , keyboardSupport = []
-    , state = IconExamples.init { label = "Mastered", name = "starFilled", icon = UiIcon.starFilled }
+    , state =
+        IconExamples.init
+            { label = "Mastered"
+            , name = "starFilled"
+            , icon = UiIcon.starFilled
+            , renderSvgCode = \name -> "UiIcon." ++ name
+            }
     , update = IconExamples.update
     , subscriptions = \_ -> Sub.none
     , preview =