elm-ssr 0.2.0 → 0.3.0

package/examples/basic/src/Example/Basic/Islands/Counter.elm

@@ -1,110 +0,0 @@
-module Example.Basic.Islands.Counter exposing
-    ( embed
-    , Flags, Model, Msg
-    , encodeFlags
-    , init, main, subscriptions, update, view
-    )
-
-import Browser
-import ElmSsr.Html as SsrHtml exposing (Node)
-import ElmSsr.Html.Attributes as SsrAttributes
-import ElmSsr.Island as Island
-import ElmSsr.Island.Shared as Shared
-import Html exposing (Html, button, code, div, span, text)
-import Html.Attributes exposing (class, type_)
-import Html.Events exposing (onClick)
-import Json.Encode as Encode
-
-
-type alias Flags =
-    { start : Int
-    }
-
-
-type alias Model =
-    { count : Int
-    }
-
-
-type Msg
-    = Increment
-    | Decrement
-    | Reset
-
-
-embed : Flags -> Node msg
-embed =
-    Island.embed "Counter"
-        { encodeFlags = encodeFlags
-        , fallback = fallback
-        , id = Just "global-counter"
-        }
-
-
-encodeFlags : Flags -> Encode.Value
-encodeFlags flags =
-    Encode.object [ ( "start", Encode.int flags.start ) ]
-
-
-fallback : Flags -> List (Node msg)
-fallback flags =
-    [ SsrHtml.div [ SsrAttributes.class "counter-island fallback" ]
-        [ SsrHtml.div [ SsrAttributes.class "counter-actions" ]
-            [ SsrHtml.span [ SsrAttributes.class "counter-value" ] [ SsrHtml.text (String.fromInt flags.start) ] ]
-        , SsrHtml.code [ SsrAttributes.class "counter-code" ] [ SsrHtml.text "Loading counter island…" ]
-        ]
-    ]
-
-
-main : Program Flags Model Msg
-main =
-    Browser.element
-        { init = init
-        , update = update
-        , view = view
-        , subscriptions = subscriptions
-        }
-
-
-init : Flags -> ( Model, Cmd Msg )
-init flags =
-    ( { count = flags.start }, Cmd.none )
-
-
-update : Msg -> Model -> ( Model, Cmd Msg )
-update msg model =
-    case msg of
-        Increment ->
-            let
-                newCount =
-                    model.count + 1
-            in
-            ( { model | count = newCount }, Shared.broadcast "count-changed" (Encode.int newCount) )
-
-        Decrement ->
-            let
-                newCount =
-                    model.count - 1
-            in
-            ( { model | count = newCount }, Shared.broadcast "count-changed" (Encode.int newCount) )
-
-        Reset ->
-            ( { model | count = 0 }, Shared.broadcast "count-changed" (Encode.int 0) )
-
-
-subscriptions : Model -> Sub Msg
-subscriptions _ =
-    Sub.none
-
-
-view : Model -> Html Msg
-view model =
-    div [ class "counter-island" ]
-        [ div [ class "counter-actions" ]
-            [ button [ class "counter-button", type_ "button", onClick Decrement ] [ text "-" ]
-            , span [ class "counter-value" ] [ text (String.fromInt model.count) ]
-            , button [ class "counter-button primary", type_ "button", onClick Increment ] [ text "+" ]
-            , button [ class "counter-button", type_ "button", onClick Reset ] [ text "reset" ]
-            ]
-        , code [ class "counter-code" ] [ text "Browser.element island using standard elm/html" ]
-        ]

package/examples/basic/src/Example/Basic/Islands/Observer.elm

@@ -1,67 +0,0 @@
-module Example.Basic.Islands.Observer exposing (embed, main)
-
-import Browser
-import ElmSsr.Html as SsrHtml exposing (Node)
-import ElmSsr.Html.Attributes as SsrAttributes
-import ElmSsr.Island as Island
-import ElmSsr.Island.Shared as Shared
-import Html exposing (Html, div, span, text)
-import Html.Attributes exposing (class)
-import Json.Decode as Decode
-import Json.Encode as Encode
-
-
-type alias Flags =
-    {}
-
-
-type alias Model =
-    { lastCount : Int
-    }
-
-
-type Msg
-    = OnGlobalEvent Shared.GlobalEvent
-
-
-embed : Flags -> Node msg
-embed =
-    Island.embed "Observer"
-        { encodeFlags = \_ -> Encode.null
-        , fallback = \_ -> [ SsrHtml.text "Waiting for updates..." ]
-        , id = Just "global-observer"
-        }
-
-
-main : Program Flags Model Msg
-main =
-    Browser.element
-        { init = \_ -> ( { lastCount = 0 }, Cmd.none )
-        , update = update
-        , view = view
-        , subscriptions = \_ -> Shared.listen OnGlobalEvent
-        }
-
-
-update : Msg -> Model -> ( Model, Cmd Msg )
-update msg model =
-    case msg of
-        OnGlobalEvent event ->
-            if event.tag == "count-changed" then
-                case Decode.decodeValue Decode.int event.payload of
-                    Ok count ->
-                        ( { model | lastCount = count }, Cmd.none )
-
-                    Err _ ->
-                        ( model, Cmd.none )
-
-            else
-                ( model, Cmd.none )
-
-
-view : Model -> Html Msg
-view model =
-    div [ class "observer-island" ]
-        [ span [ class "eyebrow" ] [ text "Observer Island" ]
-        , div [] [ text ("Last count from bus: " ++ String.fromInt model.lastCount) ]
-        ]

package/examples/basic/src/Example/Basic/Islands/Tasks.elm

@@ -1,151 +0,0 @@
-module Example.Basic.Islands.Tasks exposing
-    ( embed
-    , Flags, Model, Msg
-    , encodeFlags
-    , init, main, subscriptions, update, view
-    )
-
-import Browser
-import ElmSsr.Html as SsrHtml exposing (Node)
-import ElmSsr.Html.Attributes as SsrAttributes
-import ElmSsr.Island as Island
-import Html exposing (Html, button, div, input, li, span, text, ul)
-import Html.Attributes exposing (class, placeholder, type_, value)
-import Html.Events exposing (onClick, onInput)
-import Html.Keyed as Keyed
-import Json.Encode as Encode
-
-
-type alias Flags =
-    { items : List String
-    }
-
-
-type alias Item =
-    { id : Int
-    , label : String
-    , note : String
-    }
-
-
-type alias Model =
-    { items : List Item
-    }
-
-
-type Msg
-    = Remove Int
-    | MoveUp Int
-    | UpdateNote Int String
-
-
-embed : Flags -> Node msg
-embed =
-    Island.embed "Tasks"
-        { encodeFlags = encodeFlags
-        , fallback = fallback
-        , id = Nothing
-        }
-
-
-encodeFlags : Flags -> Encode.Value
-encodeFlags flags =
-    Encode.object [ ( "items", Encode.list Encode.string flags.items ) ]
-
-
-fallback : Flags -> List (Node msg)
-fallback flags =
-    [ SsrHtml.div [ SsrAttributes.class "tasks-island fallback" ]
-        [ SsrHtml.ul [ SsrAttributes.class "tasks-list" ]
-            (List.map
-                (\label ->
-                    SsrHtml.li [ SsrAttributes.class "task-item" ]
-                        [ SsrHtml.span [ SsrAttributes.class "task-label" ] [ SsrHtml.text label ] ]
-                )
-                flags.items
-            )
-        ]
-    ]
-
-
-main : Program Flags Model Msg
-main =
-    Browser.element
-        { init = init
-        , update = update
-        , view = view
-        , subscriptions = subscriptions
-        }
-
-
-init : Flags -> ( Model, Cmd Msg )
-init flags =
-    ( { items = List.indexedMap (\index label -> { id = index, label = label, note = "" }) flags.items }
-    , Cmd.none
-    )
-
-
-update : Msg -> Model -> ( Model, Cmd Msg )
-update msg model =
-    case msg of
-        Remove id ->
-            ( { model | items = List.filter (\item -> item.id /= id) model.items }, Cmd.none )
-
-        MoveUp id ->
-            ( { model | items = moveUp id model.items }, Cmd.none )
-
-        UpdateNote id note ->
-            ( { model | items = List.map (updateNote id note) model.items }, Cmd.none )
-
-
-updateNote : Int -> String -> Item -> Item
-updateNote id note item =
-    if item.id == id then
-        { item | note = note }
-
-    else
-        item
-
-
-moveUp : Int -> List Item -> List Item
-moveUp id items =
-    case items of
-        first :: second :: rest ->
-            if second.id == id then
-                second :: first :: rest
-
-            else
-                first :: moveUp id (second :: rest)
-
-        _ ->
-            items
-
-
-subscriptions : Model -> Sub Msg
-subscriptions _ =
-    Sub.none
-
-
-view : Model -> Html Msg
-view model =
-    div [ class "tasks-island" ]
-        [ Keyed.ul [ class "tasks-list" ] (List.map viewItem model.items) ]
-
-
-viewItem : Item -> ( String, Html Msg )
-viewItem item =
-    ( String.fromInt item.id
-    , li [ class "task-item" ]
-        [ span [ class "task-label" ] [ text item.label ]
-        , input
-            [ class "task-note"
-            , type_ "text"
-            , placeholder "note (kept across moves)"
-            , value item.note
-            , onInput (UpdateNote item.id)
-            ]
-            []
-        , button [ class "task-up", type_ "button", onClick (MoveUp item.id) ] [ text "↑" ]
-        , button [ class "task-remove", type_ "button", onClick (Remove item.id) ] [ text "remove" ]
-        ]
-    )

package/examples/basic/src/Example/Basic/Routes/Chart.elm

@@ -1,87 +0,0 @@
-module Example.Basic.Routes.Chart exposing (action, page)
-
--- File-based routing: GET /chart. A fully static page whose chart is inline SVG
--- produced by ElmSsr.Svg and serialized on the server — no client JavaScript.
-
-import ElmSsr.Action as Action exposing (Action)
-import ElmSsr.Document exposing (Document)
-import ElmSsr.Html exposing (Node, h1, p, section, span, text)
-import ElmSsr.Html.Attributes exposing (class)
-import ElmSsr.Loader as Loader exposing (Loader)
-import ElmSsr.Route exposing (Request)
-import ElmSsr.Svg as Svg exposing (Svg)
-import ElmSsr.Svg.Attributes as SvgAttr
-import Example.Basic.View.Shared as Shared
-
-
-page : Request -> Loader (Document Never)
-page _ =
-    Loader.succeed view
-
-
-action : Request -> Action (Document Never)
-action _ =
-    Action.fail 405 "Method not allowed"
-
-
-view : Document Never
-view =
-    Shared.pageDocument "SVG Chart"
-        [ section [ class "panel" ]
-            [ span [ class "eyebrow" ] [ text "Server-rendered SVG" ]
-            , h1 [] [ text "Inline SVG, rendered on the edge" ]
-            , p [] [ text "This chart is built with ElmSsr.Svg and serialized server-side. It ships zero client JavaScript." ]
-            , sparkline
-            ]
-        ]
-
-
-sparkline : Svg msg
-sparkline =
-    Svg.svg
-        [ SvgAttr.viewBox "0 0 200 100"
-        , SvgAttr.width "200"
-        , SvgAttr.height "100"
-        , SvgAttr.class "sparkline"
-        ]
-        [ Svg.defs []
-            [ Svg.linearGradient
-                [ SvgAttr.id "fill"
-                , SvgAttr.x1 "0"
-                , SvgAttr.y1 "0"
-                , SvgAttr.x2 "0"
-                , SvgAttr.y2 "1"
-                ]
-                [ Svg.stop [ SvgAttr.offset "0%", SvgAttr.stopColor "#6366f1" ] []
-                , Svg.stop [ SvgAttr.offset "100%", SvgAttr.stopColor "#0ea5e9" ] []
-                ]
-            ]
-        , Svg.rect
-            [ SvgAttr.x "0"
-            , SvgAttr.y "0"
-            , SvgAttr.width "200"
-            , SvgAttr.height "100"
-            , SvgAttr.rx "8"
-            , SvgAttr.fill "url(#fill)"
-            ]
-            []
-        , Svg.polyline
-            [ SvgAttr.points "0,80 40,60 80,70 120,30 160,45 200,10"
-            , SvgAttr.fill "none"
-            , SvgAttr.stroke "#ffffff"
-            , SvgAttr.strokeWidth "3"
-            , SvgAttr.strokeLinecap "round"
-            , SvgAttr.strokeLinejoin "round"
-            ]
-            []
-        , Svg.g [ SvgAttr.transform "translate(0,0)" ]
-            [ Svg.circle [ SvgAttr.cx "120", SvgAttr.cy "30", SvgAttr.r "4", SvgAttr.fill "#ffffff" ] [] ]
-        , Svg.text_
-            [ SvgAttr.x "8"
-            , SvgAttr.y "20"
-            , SvgAttr.fontSize "12"
-            , SvgAttr.textAnchor "start"
-            , SvgAttr.fill "#ffffff"
-            ]
-            [ Svg.text "7-day trend & momentum" ]
-        ]

package/examples/basic/src/Example/Basic/Routes/Counter.elm

@@ -1,42 +0,0 @@
-module Example.Basic.Routes.Counter exposing (page, action)
-
-import ElmSsr.Action as Action exposing (Action)
-import ElmSsr.Document exposing (Document)
-import ElmSsr.Html exposing (h1, p, section, span, text)
-import ElmSsr.Html.Attributes exposing (class)
-import ElmSsr.Loader as Loader exposing (Loader)
-import ElmSsr.Route exposing (Request)
-import Example.Basic.Islands.Counter as Counter
-import Example.Basic.Islands.Observer as Observer
-import Example.Basic.Islands.Tasks as Tasks
-import Example.Basic.View.Shared as Shared
-
-
-page : Request -> Loader (Document Never)
-page _ =
-    Loader.succeed view
-
-
-action : Request -> Action (Document Never)
-action _ =
-    Action.fail 405 "Method not allowed"
-
-
-view : Document Never
-view =
-    Shared.pageDocument "Interactive Counter"
-        [ section [ class "panel counter-panel" ]
-            [ span [ class "eyebrow" ] [ text "Island" ]
-            , h1 [] [ text "Counter route" ]
-            , p [] [ text "This page is static. Only the counter below is an interactive island; clicking it patches just its subtree, not the page." ]
-            , Counter.embed { start = 0 }
-            , Observer.embed {}
-            ]
-        , section [ class "panel tasks-panel" ]
-            [ span [ class "eyebrow" ] [ text "Keyed island" ]
-            , h1 [] [ text "Keyed list" ]
-            , p [] [ text "Reorder or remove rows: each row is keyed, so the surviving DOM nodes (and any note you type) are preserved rather than rebuilt." ]
-            , Tasks.embed { items = [ "Write the RFC", "Spike the runtime", "Cover it with tests" ] }
-            ]
-        , Shared.featureSection
-        ]

package/examples/basic/src/Example/Basic/Routes/Echo.elm

@@ -1,76 +0,0 @@
-module Example.Basic.Routes.Echo exposing (action, page)
-
--- File-based routing: GET /echo renders a form; POST /echo runs the action.
--- The action validates, performs a server effect, then redirects (PRG) — so the
--- form works with no client JavaScript at all.
-
-import ElmSsr.Action as Action exposing (Action)
-import ElmSsr.Document exposing (Document)
-import ElmSsr.Html exposing (Node, a, button, form, h1, input, label, p, section, span, text)
-import ElmSsr.Html.Attributes as Attr
-import ElmSsr.Loader as Loader exposing (Loader)
-import ElmSsr.Route as Route exposing (Request)
-import Example.Basic.View.Shared as Shared
-import Json.Decode as Decode
-
-
-page : Request -> Loader (Document Never)
-page request =
-    Loader.succeed (view request)
-
-
-action : Request -> Action (Document Never)
-action request =
-    case Maybe.map String.trim (Route.formValue "message" request) of
-        Just message ->
-            if String.isEmpty message then
-                Action.fail 422 "Message is required."
-
-            else
-                -- Run a server effect (confirm the edge region), then redirect.
-                Action.fromLoader confirmRegion
-                    |> Action.andThen (\region -> Action.redirect ("/echo?status=received&region=" ++ region))
-
-        Nothing ->
-            Action.fail 422 "Message is required."
-
-
-confirmRegion : Loader String
-confirmRegion =
-    Loader.fetchJson
-        { url = "app://status"
-        , decoder = Decode.field "region" Decode.string
-        }
-
-
-view : Request -> Document Never
-view request =
-    Shared.pageDocument "Form Action"
-        [ section [ Attr.class "panel" ]
-            (case Route.query "status" request of
-                Just "received" ->
-                    [ span [ Attr.class "eyebrow" ] [ text "Action complete" ]
-                    , h1 [] [ text "Message received" ]
-                    , p [] [ text ("Saved on the server (region: " ++ (Route.query "region" request |> Maybe.withDefault "unknown") ++ "). This page arrived via a POST → action → redirect, no client JavaScript.") ]
-                    , p [] [ a [ Attr.class "button-link", Attr.href "/echo" ] [ text "Send another" ] ]
-                    ]
-
-                _ ->
-                    [ span [ Attr.class "eyebrow" ] [ text "Forms without JS" ]
-                    , h1 [] [ text "Server action" ]
-                    , p [] [ text "Submitting this form POSTs to the route's action, which validates, runs a server effect, then redirects. It works with JavaScript disabled." ]
-                    , echoForm
-                    ]
-            )
-        ]
-
-
-echoForm : Node msg
-echoForm =
-    form [ Attr.class "echo-form", Attr.method "post", Attr.action "/echo" ]
-        [ label [ Attr.class "field" ]
-            [ span [] [ text "Message" ]
-            , input [ Attr.type_ "text", Attr.name "message", Attr.placeholder "Say something", Attr.required True ]
-            ]
-        , button [ Attr.type_ "submit", Attr.class "button-link primary" ] [ text "Send" ]
-        ]

package/examples/basic/src/Example/Basic/Routes/Greet/Name_.elm

@@ -1,37 +0,0 @@
-module Example.Basic.Routes.Greet.Name_ exposing (page, action)
-
-import ElmSsr.Action as Action exposing (Action)
-import ElmSsr.Document exposing (Document)
-import ElmSsr.Html exposing (Node, code, h1, p, section, span, text)
-import ElmSsr.Html.Attributes exposing (class)
-import ElmSsr.Loader as Loader exposing (Loader)
-import ElmSsr.Route as Route exposing (Request)
-import Example.Basic.View.Shared as Shared
-
-
-page : Request -> Loader (Document Never)
-page request =
-    Loader.succeed (view (Route.param "name" request |> Maybe.withDefault "stranger"))
-
-
-action : Request -> Action (Document Never)
-action _ =
-    Action.fail 405 "Method not allowed"
-
-
-view : String -> Document Never
-view name =
-    Shared.pageDocument ("Hello " ++ name)
-        [ greeting name
-        , Shared.featureSection
-        ]
-
-
-greeting : String -> Node msg
-greeting name =
-    section [ class "panel" ]
-        [ span [ class "eyebrow" ] [ text "Dynamic route" ]
-        , h1 [] [ text ("Hello, " ++ name ++ "!") ]
-        , p [] [ text "The name above was captured from the URL by the file Routes/Greet/Name_.elm." ]
-        , code [ class "counter-code" ] [ text "Route.param \"name\" request" ]
-        ]

package/examples/basic/src/Example/Basic/Routes/Guestbook.elm

@@ -1,86 +0,0 @@
-module Example.Basic.Routes.Guestbook exposing (action, page)
-
--- File-based routing: GET /guestbook lists entries (Loader.query); POST inserts
--- one (Action via Loader.execute) then redirects. SQL is backend-neutral — D1 on
--- Cloudflare, SQLite/Postgres locally — the Elm code is identical.
-
-import ElmSsr.Action as Action exposing (Action)
-import ElmSsr.Document exposing (Document)
-import ElmSsr.Html exposing (Node, button, form, h1, input, li, p, section, span, text, ul)
-import ElmSsr.Html.Attributes as Attr
-import ElmSsr.Loader as Loader exposing (Loader)
-import ElmSsr.Route as Route exposing (Request)
-import Example.Basic.View.Shared as Shared
-import Json.Decode as Decode
-import Json.Encode as Encode
-
-
-page : Request -> Loader (Document Never)
-page _ =
-    Loader.map view recentEntries
-
-
-recentEntries : Loader (List String)
-recentEntries =
-    Loader.query
-        { sql = "SELECT message FROM entries ORDER BY id DESC LIMIT 10"
-        , params = []
-        , decoder = Decode.field "message" Decode.string
-        }
-
-
-action : Request -> Action (Document Never)
-action request =
-    case Maybe.map String.trim (Route.formValue "message" request) of
-        Just message ->
-            if String.isEmpty message then
-                Action.fail 422 "Message is required."
-
-            else
-                Action.fromLoader (saveAndAudit message)
-                    |> Action.andThen (\_ -> Action.redirect "/guestbook")
-
-        Nothing ->
-            Action.fail 422 "Message is required."
-
-
-saveAndAudit : String -> Loader ()
-saveAndAudit message =
-    Loader.execute
-        { sql = "INSERT INTO entries (message) VALUES (?)"
-        , params = [ Encode.string message ]
-        }
-        |> Loader.andThen
-            (\_ ->
-                -- Fire-and-forget: the audit runs after the response is sent.
-                Loader.enqueue
-                    { task = "auditEntry"
-                    , payload = Encode.object [ ( "message", Encode.string message ) ]
-                    }
-            )
-
-
-view : List String -> Document Never
-view entries =
-    Shared.pageDocument "Guestbook"
-        [ section [ Attr.class "panel" ]
-            [ span [ Attr.class "eyebrow" ] [ text "SQL via the effect runner" ]
-            , h1 [] [ text "Guestbook" ]
-            , p [] [ text "Entries are read with Loader.query; the form inserts with Loader.execute inside an Action. The SQL backend is swappable without touching this code." ]
-            , entryForm
-            , ul [ Attr.class "list" ] (List.map entryItem entries)
-            ]
-        ]
-
-
-entryForm : Node msg
-entryForm =
-    form [ Attr.class "echo-form", Attr.method "post", Attr.action "/guestbook" ]
-        [ input [ Attr.type_ "text", Attr.name "message", Attr.placeholder "Sign the guestbook", Attr.required True ]
-        , button [ Attr.type_ "submit", Attr.class "button-link primary" ] [ text "Sign" ]
-        ]
-
-
-entryItem : String -> Node msg
-entryItem message =
-    li [] [ text message ]

package/examples/basic/src/Example/Basic/Routes/Index.elm

@@ -1,41 +0,0 @@
-module Example.Basic.Routes.Index exposing (page, action)
-
-import ElmSsr.Action as Action exposing (Action)
-import ElmSsr.Document exposing (Document)
-import ElmSsr.Html exposing (Node, a, div, h1, p, section, span, text)
-import ElmSsr.Html.Attributes exposing (class, href)
-import ElmSsr.Loader as Loader exposing (Loader)
-import ElmSsr.Route exposing (Request)
-import Example.Basic.View.Shared as Shared
-
-
-page : Request -> Loader (Document Never)
-page _ =
-    Loader.succeed view
-
-
-action : Request -> Action (Document Never)
-action _ =
-    Action.fail 405 "Method not allowed"
-
-
-view : Document Never
-view =
-    Shared.pageDocument "Elm SSR Library"
-        [ heroSection
-        , Shared.featureSection
-        ]
-
-
-heroSection : Node msg
-heroSection =
-    section [ class "hero panel" ]
-        [ span [ class "eyebrow" ] [ text "Pages, loaders, Browser.element islands" ]
-        , h1 [] [ text "Write Elm once, render on the edge, update in the browser." ]
-        , p []
-            [ text "Stateless pages load data and render once with zero client JavaScript. Interactive UI lives in standard Browser.element islands mounted inside the page." ]
-        , div [ class "hero-actions" ]
-            [ a [ class "button-link primary", href "/counter" ] [ text "Open island demo" ]
-            , a [ class "button-link", href "/status" ] [ text "See a loader page" ]
-            ]
-        ]