// 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>
}