>{{.label}}</span>
        <span class="help-icon" @mouseenter="showTooltip = '{{.id}}'"
            @mouseleave="showTooltip = null">â“˜</span>
    </label>

    <div class="relative w-full">
        <input 
            class="input input-sm input-bordered w-full pr-10"
            :class="{ 'invalid': touched && !validInput() }"
            :type="showPassword ? 'text' : 'password'"
            :name="name" 
            :placeholder="placeholder" 
            id="{{.id}}"
            x-model="{{.model