package input

type HandleState string

const (
	HandleStateInitial HandleState = "inital"
	HandleStateValid   HandleState = "valid"
	HandleStateInvalid HandleState = "invalid"
)

func (s HandleState) string() string {
	return string(s)
}

templ HandleInitial() {
	<div hx-target="this" hx-swap="outerHTML">
		<sl-input name="handle" placeholder="digitalgold" type="text" label="Handle" minlength="4" maxlength="12" required hx-post="/register/profile" hx-indicator="#handle-indicator" autofocus>
			<div slot="prefix">
				<sl-icon name="at-sign" library="sonr"></sl-icon>
			</div>
		</sl-input>
	</div>
	<br/>
}

templ HandleError(value string, helpText string) {
	<sl-input name="handle" placeholder="digitalgold" type="text" label="Handle" minlength="4" maxlength="12" required class="border-red-500" value={ value } help-text={ helpText }>
		<div slot="prefix">
			<sl-icon name="at-sign" library="sonr"></sl-icon>
		</div>
		<div slot="suffix" style="color: #B54549;">
			<sl-icon name="x"></sl-icon>
		</div>
	</sl-input>
	<br/>
}

templ HandleSuccess(value string) {
	<sl-input name="handle" placeholder="digitalgold" type="text" label="Handle" minlength="4" maxlength="12" required class="border-green-500" value={ value } disabled>
		<div slot="prefix" style="color: #46A758;">
			<sl-icon name="at-sign" library="sonr"></sl-icon>
		</div>
	</sl-input>
	<br/>
}