2025-08-30 22:14:57 -07:00

71 lines
1.6 KiB
Plaintext

// templui component checkbox - version: v0.94.0 installed by templui v0.94.0
package checkbox
import (
"git.hafen.run/lukas/timeshare/components/icon"
"git.hafen.run/lukas/timeshare/utils"
)
type Props struct {
ID string
Class string
Attributes templ.Attributes
Name string
Value string
Disabled bool
Required bool
Checked bool
Form string
Icon templ.Component
}
templ Checkbox(props ...Props) {
{{ var p Props }}
if len(props) > 0 {
{{ p = props[0] }}
}
<div class="relative inline-flex items-center">
<input
checked?={ p.Checked }
disabled?={ p.Disabled }
required?={ p.Required }
if p.ID != "" {
id={ p.ID }
}
if p.Name != "" {
name={ p.Name }
}
if p.Value != "" {
value={ p.Value }
} else {
value="on"
}
if p.Form != "" {
form={ p.Form }
}
type="checkbox"
class={
utils.TwMerge(
"peer size-4 shrink-0 rounded-[4px] border border-input shadow-xs",
"focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:border-ring",
"disabled:cursor-not-allowed disabled:opacity-50",
"checked:bg-primary checked:text-primary-foreground checked:border-primary",
"appearance-none cursor-pointer transition-shadow",
"relative",
p.Class,
),
}
{ p.Attributes... }
/>
<div
class="absolute left-0 top-0 h-4 w-4 pointer-events-none flex items-center justify-center text-primary-foreground opacity-0 peer-checked:opacity-100"
>
if p.Icon != nil {
@p.Icon
} else {
@icon.Check(icon.Props{Size: 14})
}
</div>
</div>
}