Move styled function to Html.Styled module

Author: edkv

README.md

@@ -13,7 +13,7 @@ module MyCss exposing (main)
 import Css exposing (..)
 import Html
 import Html.Styled exposing (..)
-import Html.Styled.Attributes exposing (css, href, src, styled)
+import Html.Styled.Attributes exposing (css, href, src)
 import Html.Styled.Events exposing (onClick)
 
 

src/Css.elm

@@ -686,7 +686,7 @@ module Css
     import Css exposing (..)
     import Html
     import Html.Styled exposing (..)
-    import Html.Styled.Attributes exposing (css, href, src, styled)
+    import Html.Styled.Attributes exposing (css, href, src)
     import Html.Styled.Events exposing (onClick)
 
     {-| A logo image, with inline styles that change on hover.

src/Html/Styled.elm

@@ -85,6 +85,7 @@ module Html.Styled
         , source
         , span
         , strong
+        , styled
         , sub
         , summary
         , sup
@@ -108,9 +109,9 @@ module Html.Styled
         )
 
 {-| Drop-in replacement for the `Html` module from the `elm-lang/html` package.
-The only functions added are `toUnstyled` and `fromUnstyled`:
+The only functions added are `styled`, `toUnstyled` and `fromUnstyled`:
 
-@docs fromUnstyled, toUnstyled
+@docs styled, fromUnstyled, toUnstyled
 
 This file is organized roughly in order of popularity. The tags which you'd
 expect to use frequently will be closer to the top.
@@ -205,6 +206,8 @@ expect to use frequently will be closer to the top.
 
 -}
 
+import Css exposing (Style)
+import Html.Styled.Internal as Internal
 import VirtualDom
 import VirtualDom.Styled
 
@@ -254,6 +257,40 @@ map =
     VirtualDom.Styled.map
 
 
+{-| Takes a function that creates an element, and pre-applies styles to it.
+
+    bigButton : List (Attribute msg) -> List (Html msg) -> Html msg
+    bigButton =
+        styled button
+            [ padding (px 30)
+            , fontWeight bold
+            ]
+
+    view : Model -> Html msg
+    view model =
+        [ text "These two buttons are identical:"
+        , bigButton [] [ text "Hi!" ]
+        , button [ css [ padding (px 30), fontWeight bold ] ] [] [ text "Hi!" ]
+        ]
+
+Here, the `bigButton` function we've defined using `styled button` is
+identical to the normal `button` function, except that it has pre-applied
+the attribute of `css [ padding (px 30), fontWeight bold ]`.
+
+You can pass more attributes to `bigButton` as usual (including other `css`
+attributes). They will be applied after the pre-applied styles.
+
+-}
+styled :
+    (List (Attribute msg) -> List (Html msg) -> Html msg)
+    -> List Style
+    -> List (Attribute msg)
+    -> List (Html msg)
+    -> Html msg
+styled fn styles attrs children =
+    fn (Internal.css styles :: attrs) children
+
+
 {-| -}
 toUnstyled : Html msg -> VirtualDom.Node msg
 toUnstyled =

src/Html/Styled/Attributes.elm

@@ -93,7 +93,6 @@ module Html.Styled.Attributes
         , start
         , step
         , style
-        , styled
         , tabindex
         , target
         , title
@@ -105,9 +104,9 @@ module Html.Styled.Attributes
         )
 
 {-| Drop-in replacement for the `Html.Attributes` module from the `elm-lang/html` package.
-The only functions added are `css`, `styled`, and `fromUnstyled`:
+The only functions added are `css` and `fromUnstyled`:
 
-@docs css, styled, fromUnstyled
+@docs css, fromUnstyled
 
 Helper functions for HTML attributes. They are organized roughly by
 category. Each attribute is labeled with the HTML tags it can be used with, so
@@ -204,6 +203,7 @@ Attributes that can be attached to any HTML tag but are less commonly used.
 
 import Css exposing (Style)
 import Html.Styled exposing (Attribute, Html)
+import Html.Styled.Internal as Internal
 import Json.Encode as Json
 import VirtualDom
 import VirtualDom.Styled
@@ -1163,46 +1163,5 @@ See the [`Css` module documentation](http://package.elm-lang.org/packages/rtfeld
 
 -}
 css : List Style -> Attribute msg
-css styles =
-    let
-        classname =
-            VirtualDom.Styled.getClassname styles
-
-        classProperty =
-            VirtualDom.property "className" (Json.string classname)
-    in
-    VirtualDom.Styled.Property classProperty styles classname
-
-
-{-| Takes a function that creates an element, and pre-applies styles to it.
-
-    bigButton : List (Attribute msg) -> List (Html msg) -> Html msg
-    bigButton =
-        styled button
-            [ padding (px 30)
-            , fontWeight bold
-            ]
-
-    view : Model -> Html msg
-    view model =
-        [ text "These two buttons are identical:"
-        , bigButton [] [ text "Hi!" ]
-        , button [ css [ padding (px 30), fontWeight bold ] ] [] [ text "Hi!" ]
-        ]
-
-    Here, the `bigButton` function we've defined using `styled button` is
-    identical to the normal `button` function, except that it has pre-applied
-    the attribute of `css [ padding (px 30), fontWeight bold ]`.
-
-    You can pass more attributes to `bigButton` as usual (including other `css`
-    attributes). They will be applied after the pre-applied styles.
-
--}
-styled :
-    (List (Attribute msg) -> List (Html msg) -> Html msg)
-    -> List Style
-    -> List (Attribute msg)
-    -> List (Html msg)
-    -> Html msg
-styled fn styles attrs children =
-    fn (css styles :: attrs) children
+css =
+    Internal.css

src/Html/Styled/Internal.elm

@@ -0,0 +1,18 @@
+module Html.Styled.Internal exposing (css)
+
+import Css
+import Json.Encode as Json
+import VirtualDom
+import VirtualDom.Styled
+
+
+css : List Css.Style -> VirtualDom.Styled.Property msg
+css styles =
+    let
+        classname =
+            VirtualDom.Styled.getClassname styles
+
+        classProperty =
+            VirtualDom.property "className" (Json.string classname)
+    in
+    VirtualDom.Styled.Property classProperty styles classname