maxamundsen/kjol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add fonts, autotable, autotable examples

Browse Source
This commit is contained in:
Max Amundsen
2026-07-13 13:01:26 -04:00
parent ea3d2a6d03
commit cf8342f8d4
71 changed files with 16084 additions and 1443 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
go/webui/forms.go
View File

@@ -159,10 +159,10 @@ func formComboboxRootCls(class, fieldWidth string) string {
func formValidationSpans(errMsg, successMsg string) []vdom.Mod {
var out []vdom.Mod
if errMsg != "" {
out = append(out, vdom.El("span", vdom.Attr("class", formErrorCls), vdom.Text(errMsg)))
out = append(out, vdom.Span(vdom.Attr("class", formErrorCls), vdom.Text(errMsg)))
}
if successMsg != "" {
out = append(out, vdom.El("span", vdom.Attr("class", formSuccessCls), vdom.Text(successMsg)))
out = append(out, vdom.Span(vdom.Attr("class", formSuccessCls), vdom.Text(successMsg)))
}
return out
}
@@ -295,9 +295,9 @@ func formCommonInputMods(p FormInputProps) []vdom.Mod {
func FormInput(p FormInputProps) *vdom.VNode {
class := formInputCls(p.Small, p.Error, p.Success, p.Class, p.OnDark)
inputMods := append([]vdom.Mod{vdom.Attr("class", class)}, formCommonInputMods(p)...)
inner := []vdom.Mod{vdom.Attr("class", "ui-form"), vdom.El("input", inputMods...)}
inner := []vdom.Mod{vdom.Attr("class", "ui-form"), vdom.Input(inputMods...)}
inner = append(inner, formValidationSpans(p.Error, p.Success)...)
return vdom.El("div", inner...)
return vdom.Div(inner...)
}
// FormInputGroup is a FormInput with a leading prefix cell (e.g. a "$" or an
@@ -311,13 +311,13 @@ func FormInputGroup(p FormInputProps, prefix *vdom.VNode) *vdom.VNode {
if prefix != nil {
pfxMods = append(pfxMods, prefix)
}
group := vdom.El("div", vdom.Attr("class", formInputGroupCls),
vdom.El("span", pfxMods...),
vdom.El("span", vdom.Attr("class", "grow flex"), vdom.El("input", inputMods...)),
group := vdom.Div(vdom.Attr("class", formInputGroupCls),
vdom.Span(pfxMods...),
vdom.Span(vdom.Attr("class", "grow flex"), vdom.Input(inputMods...)),
)
inner := []vdom.Mod{vdom.Attr("class", "ui-form"), group}
inner = append(inner, formValidationSpans(p.Error, p.Success)...)
return vdom.El("div", inner...)
return vdom.Div(inner...)
}
// -- specialized single-line inputs --------------------------------------------
@@ -639,9 +639,9 @@ func FormTextarea(p FormTextareaProps) *vdom.VNode {
if p.OnBlur != nil {
mods = append(mods, vdom.On(vdom.EVENT_BLUR, p.OnBlur))
}
inner := []vdom.Mod{vdom.Attr("class", "ui-form"), vdom.El("textarea", mods...)}
inner := []vdom.Mod{vdom.Attr("class", "ui-form"), vdom.Textarea(mods...)}
inner = append(inner, formValidationSpans(p.Error, "")...)
return vdom.El("div", inner...)
return vdom.Div(inner...)
}
// -- FormLabel -----------------------------------------------------------------
@@ -672,7 +672,7 @@ func FormLabel(p FormLabelProps, children ...*vdom.VNode) *vdom.VNode {
if p.Title != "" {
mods = append(mods, vdom.Attr("title", p.Title))
}
return vdom.El("label", kids(mods, children)...)
return vdom.Label(kids(mods, children)...)
}
// -- FormFileInput / FormSpacer / FormFieldset ---------------------------------
@@ -707,20 +707,20 @@ func FormFileInput(p FormInputProps) *vdom.VNode {
h := p.OnChange
mods = append(mods, vdom.OnEvent(vdom.EVENT_CHANGE, func(e vdom.Event) { h(e.Value()) }))
}
return vdom.El("div", vdom.Attr("class", "ui-form"), vdom.El("input", mods...))
return vdom.Div(vdom.Attr("class", "ui-form"), vdom.Input(mods...))
}
// FormSpacer is vertical spacing between form controls.
func FormSpacer() *vdom.VNode { return vdom.El("div", vdom.Attr("class", "mb-3")) }
func FormSpacer() *vdom.VNode { return vdom.Div(vdom.Attr("class", "mb-3")) }
// FormFieldset wraps children in a bordered <fieldset> with an optional legend.
func FormFieldset(legend, class string, children ...*vdom.VNode) *vdom.VNode {
mods := []vdom.Mod{
vdom.Attr("class", cx("border border-neutral-300 rounded-default py-3 px-4", class)),
vdom.El("legend", vdom.Attr("class", "px-2 text-sm font-medium text-neutral-600"), vdom.Text(legend)),
vdom.Legend(vdom.Attr("class", "px-2 text-sm font-medium text-neutral-600"), vdom.Text(legend)),
}
mods = kids(mods, children)
return vdom.El("fieldset", mods...)
return vdom.Fieldset(mods...)
}
// -- FormSelect (native <select>) ----------------------------------------------
@@ -745,7 +745,7 @@ func FormOption(value, label string, disabled bool) *vdom.VNode {
mods = append(mods, vdom.Attr("disabled", "disabled"))
}
mods = append(mods, vdom.Text(label))
return vdom.El("option", mods...)
return vdom.Option(mods...)
}
// FormSelect renders a native <select> (its <option> children are passed in).
@@ -769,7 +769,7 @@ func FormSelect(p FormSelectProps, children ...*vdom.VNode) *vdom.VNode {
mods = append(mods, vdom.OnEvent(vdom.EVENT_CHANGE, func(e vdom.Event) { h(e.Value()) }))
}
mods = kids(mods, children)
return vdom.El("div", vdom.Attr("class", "ui-form"), vdom.El("select", mods...))
return vdom.Div(vdom.Attr("class", "ui-form"), vdom.Select(mods...))
}
// FormStateSelector is a native select pre-populated with USStates.
@@ -862,7 +862,7 @@ func FormCombobox(p FormComboboxProps) *vdom.VNode {
triggerMods := []vdom.Mod{
vdom.Attr("type", "button"),
vdom.Attr("class", formTriggerCls(p.Small, p.OnDark)),
vdom.El("span", vdom.Attr("class", cx("min-w-0 truncate", placeholderCls)), vdom.Text(display)),
vdom.Span(vdom.Attr("class", cx("min-w-0 truncate", placeholderCls)), vdom.Text(display)),
IconInline(chevron, 16, chevronCls),
}
if p.Disabled {
@@ -874,7 +874,7 @@ func FormCombobox(p FormComboboxProps) *vdom.VNode {
rootMods := []vdom.Mod{
vdom.Attr("class", formComboboxRootCls(p.Class, p.FieldWidth)),
vdom.El("button", triggerMods...),
vdom.Button(triggerMods...),
}
if p.Open {
@@ -891,9 +891,8 @@ func FormCombobox(p FormComboboxProps) *vdom.VNode {
searchWrapCls = formDropdownSearchWrapDark
searchInputCls = formDropdownSearchInputDark
}
ddMods = append(ddMods, vdom.El("div", vdom.Attr("class", searchWrapCls),
vdom.El("input",
vdom.Attr("type", "text"),
ddMods = append(ddMods, vdom.Div(vdom.Attr("class", searchWrapCls),
vdom.Input(vdom.Attr("type", "text"),
vdom.Attr("class", searchInputCls),
vdom.Attr("placeholder", pick(p.SearchPlaceholder, "Search...")),
),
@@ -913,7 +912,7 @@ func FormCombobox(p FormComboboxProps) *vdom.VNode {
if p.OnDark {
noResultsCls = formDropdownNoResultsDark
}
ddMods = append(ddMods, vdom.El("div", vdom.Attr("class", noResultsCls), vdom.Text("No options found")))
ddMods = append(ddMods, vdom.Div(vdom.Attr("class", noResultsCls), vdom.Text("No options found")))
}
for _, opt := range p.Options {
ov := opt.Value
@@ -925,11 +924,11 @@ func FormCombobox(p FormComboboxProps) *vdom.VNode {
optMods = append(optMods, vdom.On(vdom.EVENT_CLICK, func() { oc(ov) }))
}
optMods = append(optMods, vdom.Text(opt.Label))
ddMods = append(ddMods, vdom.El("button", optMods...))
ddMods = append(ddMods, vdom.Button(optMods...))
}
rootMods = append(rootMods, vdom.El("div", ddMods...))
rootMods = append(rootMods, vdom.Div(ddMods...))
}
return vdom.El("div", rootMods...)
return vdom.Div(rootMods...)
}
// FormSearchableSelect is a FormCombobox with the search box shown.
@@ -976,14 +975,14 @@ func FormMultiSelect(p FormMultiSelectProps) *vdom.VNode {
var triggerContent *vdom.VNode
switch {
case len(selected) == 0:
triggerContent = vdom.El("span", vdom.Attr("class", "text-neutral-500"), vdom.Text(pick(p.Placeholder, "Select options")))
triggerContent = vdom.Span(vdom.Attr("class", "text-neutral-500"), vdom.Text(pick(p.Placeholder, "Select options")))
case len(selected) > maxTags:
n := len(selected)
suffix := "s"
if n == 1 {
suffix = ""
}
triggerContent = vdom.El("span", vdom.Text(strconv.Itoa(n)+" item"+suffix+" selected"))
triggerContent = vdom.Span(vdom.Text(strconv.Itoa(n) + " item" + suffix + " selected"))
default:
tagSize := "py-0.5 px-2 text-sm"
if p.Small {
@@ -1006,13 +1005,13 @@ func FormMultiSelect(p FormMultiSelectProps) *vdom.VNode {
cur := p.Value
rmMods = append(rmMods, vdom.On(vdom.EVENT_CLICK, func() { oc(formRemoveStr(cur, ov)) }))
}
tag := vdom.El("span", vdom.Attr("class", tagCls),
tag := vdom.Span(vdom.Attr("class", tagCls),
vdom.Text(opt.Label),
vdom.El("button", rmMods...),
vdom.Button(rmMods...),
)
tagsMods = append(tagsMods, tag)
}
triggerContent = vdom.El("div", tagsMods...)
triggerContent = vdom.Div(tagsMods...)
}
pad := "p-2"
@@ -1027,7 +1026,7 @@ func FormMultiSelect(p FormMultiSelectProps) *vdom.VNode {
triggerMods := []vdom.Mod{
vdom.Attr("type", "button"),
vdom.Attr("class", triggerCls),
vdom.El("div", vdom.Attr("class", "flex-1 overflow-hidden flex items-center min-w-0"), triggerContent),
vdom.Div(vdom.Attr("class", "flex-1 overflow-hidden flex items-center min-w-0"), triggerContent),
IconInline(chevron, 16, "text-neutral-400"),
}
if p.Disabled {
@@ -1039,16 +1038,15 @@ func FormMultiSelect(p FormMultiSelectProps) *vdom.VNode {
rootMods := []vdom.Mod{
vdom.Attr("class", formComboboxRootCls(p.Class, p.FieldWidth)),
vdom.El("button", triggerMods...),
vdom.Button(triggerMods...),
}
if p.Open {
ddMods := []vdom.Mod{vdom.Attr("class", cx("absolute left-0 top-full mt-1 z-50 w-full", formDropdown))}
if p.Searchable {
ddMods = append(ddMods, vdom.El("div", vdom.Attr("class", formDropdownSearchWrap),
vdom.El("input",
vdom.Attr("type", "text"),
ddMods = append(ddMods, vdom.Div(vdom.Attr("class", formDropdownSearchWrap),
vdom.Input(vdom.Attr("type", "text"),
vdom.Attr("class", formDropdownSearchInput),
vdom.Attr("placeholder", pick(p.SearchPlaceholder, "Search...")),
),
@@ -1075,11 +1073,11 @@ func FormMultiSelect(p FormMultiSelectProps) *vdom.VNode {
}
}))
}
ddMods = append(ddMods, vdom.El("div", vdom.Attr("class", formSelectAllWrap), vdom.El("button", saMods...)))
ddMods = append(ddMods, vdom.Div(vdom.Attr("class", formSelectAllWrap), vdom.Button(saMods...)))
}
if len(p.Options) == 0 {
ddMods = append(ddMods, vdom.El("div", vdom.Attr("class", formDropdownNoResults), vdom.Text("No options found")))
ddMods = append(ddMods, vdom.Div(vdom.Attr("class", formDropdownNoResults), vdom.Text("No options found")))
}
for _, opt := range p.Options {
ov := opt.Value
@@ -1090,7 +1088,7 @@ func FormMultiSelect(p FormMultiSelectProps) *vdom.VNode {
optMods := []vdom.Mod{
vdom.Attr("type", "button"),
vdom.Attr("class", formDropdownOption),
vdom.El("input", cbMods...),
vdom.Input(cbMods...),
vdom.Text(opt.Label),
}
if opt.Disabled {
@@ -1100,11 +1098,11 @@ func FormMultiSelect(p FormMultiSelectProps) *vdom.VNode {
cur := p.Value
optMods = append(optMods, vdom.On(vdom.EVENT_CLICK, func() { oc(formToggleStr(cur, ov)) }))
}
ddMods = append(ddMods, vdom.El("button", optMods...))
ddMods = append(ddMods, vdom.Button(optMods...))
}
rootMods = append(rootMods, vdom.El("div", ddMods...))
rootMods = append(rootMods, vdom.Div(ddMods...))
}
return vdom.El("div", rootMods...)
return vdom.Div(rootMods...)
}
// -- []string selection helpers (for FormMultiSelect) --------------------------