2024-12-11 14:55:19 -05:00
|
|
|
package form
|
2024-12-10 23:41:49 -05:00
|
|
|
|
|
|
|
type InputHandleState string
|
|
|
|
|
|
|
|
const (
|
|
|
|
InputHandleStateInitial InputHandleState = "inital"
|
|
|
|
InputHandleStateValid InputHandleState = "valid"
|
|
|
|
InputHandleStateInvalid InputHandleState = "invalid"
|
|
|
|
)
|
|
|
|
|
|
|
|
func (s InputHandleState) string() string {
|
|
|
|
return string(s)
|
|
|
|
}
|
|
|
|
|
2024-12-11 11:36:52 -05:00
|
|
|
templ InputHandle() {
|
2024-12-10 23:41:49 -05:00
|
|
|
<sl-input name="handle" placeholder="digitalgold" type="text" label="Handle" minlength="4" maxlength="12" required>
|
|
|
|
<div slot="prefix">
|
|
|
|
<sl-icon name="at-sign" library="sonr"></sl-icon>
|
|
|
|
</div>
|
|
|
|
</sl-input>
|
2024-12-11 14:57:07 -05:00
|
|
|
<br/>
|
2024-12-10 23:41:49 -05:00
|
|
|
}
|
2024-12-11 11:36:52 -05:00
|
|
|
|
|
|
|
templ InputHandleError() {
|
|
|
|
<sl-input name="handle" placeholder="digitalgold" type="text" label="Handle" minlength="4" maxlength="12" required class="border-red-500">
|
|
|
|
<div slot="prefix">
|
|
|
|
<sl-icon name="at-sign" library="sonr"></sl-icon>
|
|
|
|
</div>
|
|
|
|
<div slot="suffix" style="color: #B54549;">
|
|
|
|
<sl-icon name="at-sign" library="sonr"></sl-icon>
|
|
|
|
</div>
|
|
|
|
</sl-input>
|
2024-12-11 14:57:07 -05:00
|
|
|
<br/>
|
2024-12-11 11:36:52 -05:00
|
|
|
}
|
|
|
|
|
|
|
|
templ InputHandleValid() {
|
|
|
|
<sl-input name="handle" placeholder="digitalgold" type="text" label="Handle" minlength="4" maxlength="12" required class="border-green-500">
|
|
|
|
<div slot="prefix" style="color: #46A758;">
|
|
|
|
<sl-icon name="at-sign" library="sonr"></sl-icon>
|
|
|
|
</div>
|
|
|
|
</sl-input>
|
2024-12-11 14:57:07 -05:00
|
|
|
<br/>
|
2024-12-11 11:36:52 -05:00
|
|
|
}
|