Goshtoso App Shells · v0.1.6

Component Docs Shell

A complete documentation frame for component libraries, API references, design systems, and product documentation.

componentdocshell Open API documentation

What the package owns

Shell-owned structure stays stable while the application supplies its brand, navigation, routes, and content.

Live proof: this page is rendered inside Component Docs Shell.

HeaderBrand, appearance controls, family navigation, and a consumer-owned actions slot.

SearchThe shell owns scoped sidebar search. Consumer-owned global search belongs in HeaderActions.

Scoped sidebarLocal pages, grouped sections, active route, and mobile drawer behavior.

Main + TOCOne content scroller, optional table of contents, focus handling, and fragment navigation.

Install and compose

Install

go get github.com/araihu/goshtoso-app-shells/[email protected]

Assets and composition

import (
    "net/http"

    "github.com/araihu/goshtoso/assets"
    "github.com/araihu/goshtoso/components/sidebar"
    "github.com/araihu/goshtoso-app-shells/componentdocshell"
    shellassets "github.com/araihu/goshtoso-app-shells/componentdocshell/assets"
)

func registerAssets(mux *http.ServeMux) {
    mux.Handle("GET /assets/", assets.Handler())
    mux.Handle("GET /componentdocshell/assets/", shellassets.Handler())
}

cfg := componentdocshell.Config{
    Brand: componentdocshell.Brand{
        Name: "Product docs",
        HomeURL: "/",
    },
    Navigation: componentdocshell.Navigation{
        Items: []sidebar.Item{{
            ID: "overview", Label: "Overview", Href: "/",
        }},
    },
    Interactions: componentdocshell.InteractionConfig{
        EnableHTMX: true,
        LocalRuntime: true,
    },
}
page := componentdocshell.Page{
    Title: "Overview",
    Active: "overview",
    Content: overviewContent(),
}
view := componentdocshell.Layout(cfg, page)

Full documents and HTMX fragments

Serve Layout for ordinary browser requests. When EnableHTMX adds enhanced navigation, inspect HX-Request and serve Fragment instead; sending Layout into the main target would swap a complete document into the page.

Component Docs Shell Fragment emits the document title plus out-of-band replacements for main content, scoped sidebar, and family navigation. Active page and family state therefore stay synchronized after navigation.

HTTP response selection

func renderDocs(
    writer http.ResponseWriter,
    request *http.Request,
    cfg componentdocshell.Config,
    page componentdocshell.Page,
) {
    view := componentdocshell.Layout(cfg, page)
    if request.Header.Get("HX-Request") == "true" {
        view = componentdocshell.Fragment(cfg, page)
    }
    if err := view.Render(request.Context(), writer); err != nil {
        http.Error(writer, err.Error(), http.StatusInternalServerError)
    }
}

Consumer boundary

The shell owns the surrounding frame, responsive behavior, and lifecycle hooks. The consumer owns product vocabulary, authorization, data, navigation policy, metadata, and content.