Skip to content

PrimePassword

A FormKit wrapper for PrimeVue's Password component.

Live Example on Website

Usage

vue
<FormKit type="primepassword" v-model="password" />

Object-based Example

vue
<script setup>
const schema = [
  { $formkit: 'primePassword', name: 'password', label: 'Password', help: 'Enter your new password', feedback: true },
  { $formkit: 'primePassword', name: 'password_confirm', label: 'Confirm password', help: 'Enter your new password again.', validation: 'required|confirm', toggleMask: true, validationLabel: 'password confirmation' },
]
const data = {}
</script>

<template>
  <FormKit :schema="schema" :data="data" />
</template>

Props

NameTypeDescription
feedbackbooleanShow password strength feedback
mediumRegexstringRegex for medium strength
strongRegexstringRegex for strong strength
promptLabelstringPrompt label
weakLabelstringWeak label
mediumLabelstringMedium label
strongLabelstringStrong label
maskIconstringIcon for mask
unmaskIconstringIcon for unmask
ptobjectPass-through options
ptOptionsobjectPass-through options
unstyledbooleanDisable default styles
placeholderstringPlaceholder text
toggleMaskbooleanShow toggle mask button
sizestringInput size

See PrimeVue Password docs for more details.

FormKit PrimeVue Module