AppShell

Use it well.

Place inside Layout and do not nest shells or main landmarks. Navigation uses a native disclosure; Actions and Footer accept components.

This is the source compiled for the preview. Select the text to copy it, or download the file. Change the package name and demo routes for your application.

package examples

import "github.com/Tend-Stack/GothUI/v2026/components"

templ ExampleAppShell() {
	@components.AppShell(components.AppShellProps{Brand: "Studio", BrandHref: "/catalog", Title: "A place for your work", Navigation: []components.NavItem{{Label: "Catalog", Href: "/catalog", Current: true}, {Label: "Dashboard", Href: "/dashboard"}}}) {
		<p>Use one application shell inside a Layout. Its native sidebar disclosure remains keyboard operable.</p><a href="/catalog/appshell">Back to AppShell</a>
	}
}