components

package
v0.3.0 Latest Latest
Warning

This package is not in the latest version of its module.

Go to latest
Published: Aug 24, 2026 License: AGPL-3.0 Imports: 3 Imported by: 0

Documentation

Overview

Package components ships the Hearth shell's structural templ components: the parameterized Layout (264px sidebar plus main) and NavPill. Palette, PWA manifest wiring, and app-specific motion are deliberately NOT modeled here — see ShellProps's HeadExtras, SidebarBrand, SidebarExtra, and SidebarFooter slots, which are where each app injects that content.

templ: version: v0.3.1020

templ: version: v0.3.1020

Index

Constants

This section is empty.

Variables

This section is empty.

Functions

func Layout

func Layout(props ShellProps, nav []NavItem, content templ.Component) templ.Component

Layout renders the Hearth shell — a fixed left sidebar plus the main content area — around content. Use it with the render seam, binding props and nav into the layout func:

layout := func(c templ.Component) templ.Component { return components.Layout(props, nav, c) }
render.Page(ctx, w, r, layout, content)
func NavPill(label, href string, active bool) templ.Component

NavPill renders a sidebar navigation pill. The active pill uses the shared primary-tint background and primary-deep text (see ui/css/theme.css); an inactive pill is quiet until hovered.

Types

type NavItem struct {
	Label  string
	Href   string
	Active bool
}

NavItem is a sidebar navigation entry. Active marks the current page.

type ShellProps

type ShellProps struct {
	// AppName renders in <title>, and in the sidebar brand row when
	// SidebarBrand is nil.
	AppName string
	// FaviconHref is the favicon <link> target, e.g. "/static/favicon.svg".
	// Empty renders no favicon link.
	FaviconHref string
	// ThemeColor sets the meta theme-color tag, e.g. "#6f8c6a". Empty
	// renders no theme-color meta.
	ThemeColor string
	// StylesheetHref is the compiled Tailwind CSS bundle this app built from
	// ui/css/theme.css plus its own palette (e.g. "/static/css/app.css").
	StylesheetHref string
	// HeadExtras renders after the HTMX script and before Alpine's — the
	// position an app's own PWA manifest link, service worker registration,
	// or Alpine-extension scripts (which must load before alpine.min.js;
	// see ui/static's doc) need. Nil renders nothing.
	HeadExtras templ.Component
	// SidebarBrand renders the sidebar's brand row (logo mark plus name).
	// Nil falls back to a plain AppName label.
	SidebarBrand templ.Component
	// SidebarExtra renders below primary nav — member/owner lists, a mini
	// calendar, and similar per-app sidebar content. Nil renders nothing.
	SidebarExtra templ.Component
	// SidebarFooter renders pinned to the sidebar's bottom cluster (logout
	// form, cross-app links, and similar). Nil renders nothing.
	SidebarFooter templ.Component
}

ShellProps configures the Hearth shell (the fixed 264px sidebar plus main content area shared by every Hearth app). Token NAMES referenced by the shell's CSS are the same across apps; token VALUES, PWA identity, and motion scripts are each app's own and are injected through the slots below rather than modeled here.

Jump to

Keyboard shortcuts

? : This menu
/ : Search site
f or F : Jump to
y or Y : Canonical URL