3.0.0 - Drawer refactoring

elm-package.json

@@ -1,5 +1,5 @@
 {
-    "version": "2.0.0",
+    "version": "3.0.0",
     "summary": "Elm helpers to render carwow theme ui components",
     "repository": "https://github.com/carwow/elm-theme.git",
     "license": "BSD3",

src/CarwowTheme/Drawer.elm

@@ -1,11 +1,11 @@
-module CarwowTheme.Drawer exposing (Model, Properties, Msg(Toggle), init, view, subscriptions, update)
+module CarwowTheme.Drawer exposing (Model, Properties, Msg(Toggle), Action(Close, Open), init, view, subscriptions, update)
 
 {-| Drawer
 
 
 # Exports
 
-@docs Model, Properties, Msg, init, view, subscriptions, update
+@docs Model, Properties, Msg, init, view, subscriptions, update, Action
 
 -}
 
@@ -20,10 +20,22 @@ import Html.Events exposing (onClick)
 -}
 type alias Model =
     { id : String
-    , visible : Bool
+    , state : State
     }
 
 
+type State
+    = Opened
+    | Closed
+
+
+{-| Placeholder
+-}
+type Action
+    = Open
+    | Close
+
+
 {-| Placeholder
 -}
 type alias Properties msg =
@@ -36,15 +48,15 @@ type alias Properties msg =
 -}
 type Msg
     = KeyPressed Keyboard.KeyCode
-    | Toggle
+    | Toggle Action
 
 
 {-| Placeholder
 -}
 init : String -> Model
 init id =
     { id = id
-    , visible = False
+    , state = Closed
     }
 
 
@@ -53,30 +65,23 @@ init id =
 update : Msg -> Model -> ( Model, Cmd Msg )
 update msg model =
     case msg of
-        KeyPressed code ->
-            let
-                visible =
-                    case code of
-                        27 ->
-                            False
-
-                        _ ->
-                            model.visible
-            in
-                ( { model | visible = visible }, Cmd.none )
-
-        Toggle ->
-            let
-                isVisible =
-                    not model.visible
-            in
-                ( { model | visible = isVisible }, Cmd.none )
+        KeyPressed 27 ->
+            ( { model | state = Closed }, Cmd.none )
+
+        KeyPressed _ ->
+            ( model, Cmd.none )
+
+        Toggle Open ->
+            ( { model | state = Opened }, Cmd.none )
+
+        Toggle Close ->
+            ( { model | state = Closed }, Cmd.none )
 
 
 {-| Placeholder
 -}
-view : Model -> Properties msg -> msg -> Html msg
-view model properties toggleDrawer =
+view : Model -> Properties msg -> msg -> msg -> Html msg
+view model properties toggleOpenMsg toggleCloseMsg =
     let
         closeButton =
             label
@@ -92,16 +97,16 @@ view model properties toggleDrawer =
                 , type_ "radio"
                 , id (model.id ++ "-open")
                 , name model.id
-                , checked model.visible
-                , onClick toggleDrawer
+                , checked (model.state == Opened)
+                , onClick toggleOpenMsg
                 ]
                 []
             , input
                 [ class "modal-radio-button--close"
                 , type_ "radio"
                 , id (model.id ++ "-close")
                 , name model.id
-                , onClick toggleDrawer
+                , onClick toggleCloseMsg
                 ]
                 []
             , div