README
¶
tinywasm/html
HTML element builder API for TinyWasm components.
Overview
tinywasm/html provides declarative HTML element builders for use in TinyWasm components.
It was separated from tinywasm/dom so that dom can focus solely on DOM manipulation and syscall.
Installation
go get github.com/tinywasm/html
Usage (dot-import)
import (
. "github.com/tinywasm/html" // Div, Span, H1, Nav, Button...
. "github.com/tinywasm/dom" // Event, Component, Render, Append
)
func (c *MyComponent) Render() *dom.Element {
return Div().Class("container").Child(
H1().Text("Welcome"),
P().Text("Minimalist UI."),
Button().Text("Click").On("click", func(e dom.Event) {}),
)
}
SSR HTML Templates
Components that need a custom SSR template implement RenderHTML() string in their html.go file:
//go:build !wasm
package mycomponent
import . "github.com/tinywasm/html"
func (c *MyComponent) RenderHTML() string {
return Div().Set(clsRoot.AsAttr()).String()
}
Available Builders
Block: Div, Span, P, Pre, Code, Strong, Small, Mark Headings: H1, H2, H3, H4, H5, H6 Lists: Ul, Ol, Li Semantic: Nav, Section, Main, Article, Header, Footer, Aside, Details, Summary, Dialog, Figure, Figcaption Tables: Table, Thead, Tbody, Tfoot, Tr, Th, Td Form-adjacent: Fieldset, Legend, Label, Button, Canvas, Style, Script Special: A(href), Input(type), Option, SelectedOption, Br, Hr
Related Packages
- tinywasm/dom — DOM manipulation, Element type, lifecycle interfaces
- tinywasm/svg — SVG builders + icon sprite
- tinywasm/image — Image builders
Documentation
¶
Index ¶
- func A(href string) *Element
- func Article() *Element
- func Aside() *Element
- func Br() *Element
- func Button() *Element
- func Canvas() *Element
- func Code() *Element
- func Details() *Element
- func Dialog() *Element
- func Div() *Element
- func Document(opts DocumentOptions, body ...Component) *Element
- func DocumentString(opts DocumentOptions, body ...Component) string
- func Fieldset() *Element
- func Figcaption() *Element
- func Figure() *Element
- func Footer() *Element
- func H1() *Element
- func H2() *Element
- func H3() *Element
- func H4() *Element
- func H5() *Element
- func H6() *Element
- func Header() *Element
- func Hr() *Element
- func Input(typ string) *Element
- func Label() *Element
- func Legend() *Element
- func Li() *Element
- func Main() *Element
- func Mark() *Element
- func Nav() *Element
- func Ol() *Element
- func Option(value, text string) *Element
- func P() *Element
- func Pre() *Element
- func RewriteAssetURLs(htmlStr, newRoot string) string
- func Script() *Element
- func Section() *Element
- func SelectedOption(value, text string) *Element
- func Small() *Element
- func Span() *Element
- func Strong() *Element
- func Style() *Element
- func Summary() *Element
- func Table() *Element
- func Tbody() *Element
- func Td() *Element
- func Tfoot() *Element
- func Th() *Element
- func Thead() *Element
- func Tr() *Element
- func Ul() *Element
- type DocumentOptions
- type HTMLProvider
Constants ¶
This section is empty.
Variables ¶
This section is empty.
Functions ¶
func Document ¶ added in v0.0.3
func Document(opts DocumentOptions, body ...Component) *Element
Document builds the complete document shell as *Element (the <html> element). Does not include <!DOCTYPE html> — use DocumentString for the full output.
func DocumentString ¶ added in v0.0.3
func DocumentString(opts DocumentOptions, body ...Component) string
DocumentString renders the full HTML document including <!DOCTYPE html>. This is what assetmin writes to disk as index.html.
func Figcaption ¶
func Figcaption() *Element
func RewriteAssetURLs ¶ added in v0.0.3
RewriteAssetURLs rewrites relative href/src attributes in an HTML fragment, keeping only the filename and prepending newRoot. It ignores absolute URLs, rooted paths, and non-file schemes (data:, mailto:, tel:, javascript:). SSR/backend-only: this is excluded from wasm builds (its only caller, assetmin, is backend).
func SelectedOption ¶
func SelectedOption(value, text string) *Element
Types ¶
type DocumentOptions ¶ added in v0.0.3
type DocumentOptions struct {
Lang string // default "en"
Title string
CSSURL string // <link rel="stylesheet">
JSURL string // <script src defer>
FaviconURL string // <link rel="icon">
Head string // extra markup for <head> (optional)
}
DocumentOptions configures the document shell.
type HTMLProvider ¶
type HTMLProvider interface {
RenderHTML() string
}
HTMLProvider is an optional capability: components that expose a static SSR HTML template fragment for injection by assetmin.
Implement in a component's html.go file (//go:build !wasm). Most components do NOT need this — only those with a static shell distinct from their dynamic Render() output.
Example in mycomponent/html.go:
//go:build !wasm
package mycomponent
import . "github.com/tinywasm/html"
func (c *MyComponent) RenderHTML() string {
return Div(clsRoot.AsAttr()).String()
}
For raw static HTML:
func (c *MyComponent) RenderHTML() string {
return `<div class="root"></div>`
}
Source Files
Directories