Add fonts, autotable, autotable examples

This commit is contained in:
2026-07-13 13:01:26 -04:00
parent ea3d2a6d03
commit cf8342f8d4
71 changed files with 16084 additions and 1443 deletions

View File

@@ -15,11 +15,32 @@
// - Tailwind classes are copied verbatim so kjol/cmd/twcss (scanning these .go
// files) emits the matching CSS. Custom tokens (rounded-default, bg-primary,
// text-text-heading, …) come from the app's @theme block.
// - Browser-only behavior (floating-ui positioning, portals, focus traps,
// element measurement) has no equivalent in the neutral runtime; those
// components port their structure + Tailwind + signal/event wiring, and
// approximate positioning with CSS where possible. Such gaps are marked
// with a NOTE in the component's file.
//
// # Browser-backed components
//
// Anything that has to measure the page — a popover that must not fall off the
// screen, a column you can drag wider, a tour that spotlights an element — reaches
// the browser through the host API in kjol/wasmruntime (Measure, Viewport, SetStyle,
// RAF, AfterRender, OnDocument/OnWindow, storage, …). That API is dual-build: real
// in the browser, no-op stubs natively. So these components stay neutral and still
// server-render: on the server every measurement is the zero Rect, no listener is
// installed, and the component renders its unmeasured state (a panel that is closed,
// a table in its declared column order). See kjol/wasmruntime/host.go.
//
// Such components are CONTROLLERS, not plain functions: they own refs, timers and
// open state, so they must be created ONCE — alongside your signals, never inside a
// render closure, which would rebuild them every frame:
//
// menu := webui.NewMenu(webui.MenuOptions{})
// table := webui.NewAutoTableState(cols, webui.AutoTableStateOptions{})
//
// return func() *vdom.VNode {
// return Div(menu.Trigger(…), menu.Content(…), table.Render(…))
// }
//
// Floating panels (Tooltip, Popover, Menu, Submenu, DatePicker, Modal, Tutorial) are
// all built on the Floating controller in floating.go, which portals them to
// document.body and positions them with the engine in position.go.
package webui
import (