README
¶
tinywasm/layout/platformd
Shell layout with hash-based routing, nav rail, header, and notifications.
Usage
p := &platformd.Platform{
AppName: "My App",
Modules: []platformd.Module{
{
ID: "home",
Label: "Home",
Default: true,
Icon: svg.Icon("icon-home", "pd-nav-icon"),
View: &MyView{},
},
},
}
dom.Append("body", p)
Icons
Icons are SVG sprite references. Register them in your consumer's svg.go:
//go:build !wasm
package main
import "github.com/tinywasm/svg"
// or consume Platform's built-in icons (icon-home, icon-products, icon-info)
The platform registers icon-home, icon-products, icon-info by default via Platform.IconSvg().
CSS Tokens
See platformd/tokens.go for the full list of CSS custom properties.
All visual customization should go through these tokens.
Documentation
¶
Index ¶
Constants ¶
This section is empty.
Variables ¶
View Source
var ( IconHome = svg.Define("home", "0 0 576 512", svg.Path("M280.37 148.26L96 300.11V464a16 16 0 0 0 16 16l112.06-.29a16 16 0 0 0 15.92-16V368a16 16 0 0 1 16-16h64a16 16 0 0 1 16 16v95.64a16 16 0 0 0 16 16.05L464 480a16 16 0 0 0 16-16V300L295.67 148.26a12.19 12.19 0 0 0-15.3 0zM571.6 251.47L488 182.56V44.05a12 12 0 0 0-12-12h-56a12 12 0 0 0-12 12v72.61L318.47 43a48 48 0 0 0-61 0L4.34 251.47a12 12 0 0 0-1.6 16.9l25.5 31A12 12 0 0 0 45.15 301l235.22-193.74a12.19 12.19 0 0 1 15.3 0L530.9 301a12 12 0 0 0 16.9-1.6l25.5-31a12 12 0 0 0-1.7-16.93z"), ) IconProducts = svg.Define("products", "0 0 448 512", svg.Path("M350.85 129c25.97 4.67 47.27 18.67 63.92 42 14.65 20.67 24.64 46.67 29.96 78 4.67 28.67 4.32 57.33-1 86-7.99 47.33-23.97 87-47.94 119-28.64 38.67-64.59 58-107.87 58-10.66 0-22.3-3.33-34.96-10-8.66-5.33-18.31-8-28.97-8s-20.3 2.67-28.97 8c-12.66 6.67-24.3 10-34.96 10-43.28 0-79.23-19.33-107.87-58-23.97-32-39.95-71.67-47.94-119-5.32-28.67-5.67-57.33-1-86 5.32-31.33 15.31-57.33 29.96-78 16.65-23.33 37.95-37.33 63.92-42 15.98-2.67 37.95-.33 65.92 7 23.97 6.67 44.28 14.67 60.93 24 16.65-9.33 36.96-17.33 60.93-24 27.98-7.33 49.96-9.67 65.94-7zm-54.94-41c-9.32 8.67-21.65 15-36.96 19-10.66 3.33-22.3 5-34.96 5l-14.98-1c-1.33-9.33-1.33-20 0-32 2.67-24 10.32-42.33 22.97-55 9.32-8.67 21.65-15 36.96-19 10.66-3.33 22.3-5 34.96-5l14.98 1 1 15c0 12.67-1.67 24.33-4.99 35-3.99 15.33-10.31 27.67-18.98 37z"), ) IconInfo = svg.Define("info", "0 0 16 16", svg.Path("m7 11h2v2h-2zm4-7c0.552 0 1 0.448 1 1v3l-3 2h-2v-1l3-2v-1h-5v-2h6zm-3-2.5c-1.736 0-3.369 0.676-4.596 1.904s-1.904 2.86-1.904 4.596 0.676 3.369 1.904 4.596 2.86 1.904 4.596 1.904 3.369-0.676 4.596-1.904 1.904-2.86 1.904-4.596-0.676-3.369-1.904-4.596-2.86-1.904-4.596-1.904zm0-1.5c4.418 0 8 3.582 8 8s-3.582 8-8 8-8-3.582-8-8 3.582-8 8-8z"), ) )
View Source
var (
)
Functions ¶
This section is empty.
Types ¶
type Module ¶
type Module struct {
ID string // hash slug, e.g. "products" → routed via "#products"
Label string // text shown next to icon in expanded rail
Icon Component // icon component (usually a tinywasm/icons Symbol)
View Component // the module's content (often a *rightpanel.RightPanel)
Default bool // if true and no hash set, this module is shown initially
}
Module describes one registered route/page in the shell. Pure data: the consumer creates these and passes them to Platform.
type Platform ¶
type Platform struct {
Element
// AppName appears in the header (left side, near UserBlock).
AppName string
// UserBlock slot — usually an avatar/name/logout link. Optional.
UserBlock Component
// Modules registered in order — appearance order in the nav rail.
Modules []Module
// contains filtered or unexported fields
}
Platform is the typed skeleton root.
func (*Platform) Activate ¶
Activate programmatically switches to a module by ID (also updates window.location.hash on wasm builds).
func (*Platform) Init ¶ added in v0.0.6
func (p *Platform) Init(ctx Ctx)
Init initializes the platform state and routing.
Source Files
Directories
Click to show internal directories.
Click to hide internal directories.