Password Field

The password field renders a password input with optional strength criteria.

Schema Properties

Prop

Type

UI Options

Option	Type	Default	Description
`strengthIndicator`	`boolean`	`false`	Show a strength indicator bar
`showRequirements`	`boolean`	`false`	Show a checklist of requirements
`allowGenerate`	`boolean`	`false`	Show a generate password button
`copyable`	`boolean`	`false`	Show a copy button
`labels`	`object`	-	Text and label overrides
`labels.strength`	`object`	-	Custom labels for strength levels
`labels.requirements`	`object`	-	Custom labels for checklist items
`className`	`string`	-	CSS class applied to the container
`width`	`string \| number`	-	Inline width applied to the field

React Overrides: The label, description, and all ui.labels properties support ReactNode (JSX) when importing defineSchema from @buildnbuzz/form-react.

Basic Usage

const schema = defineSchema({
  fields: [
    {
      type: "password",
      name: "password",
      label: "Password",
      required: true,
      minLength: 8,
    },
  ],
});

Password Criteria

Set strength requirements:

{
  type: "password",
  name: "password",
  label: "Password",
  required: true,
  minLength: 8,
  criteria: {
    requireUppercase: true,
    requireLowercase: true,
    requireNumber: true,
    requireSpecial: true,
  },
}

Examples

Confirm Password

const schema = defineSchema({
  fields: [
    {
      type: "password",
      name: "password",
      label: "Password",
      required: true,
      minLength: 8,
    },
    {
      type: "password",
      name: "confirmPassword",
      label: "Confirm Password",
      required: true,
      validate: {
        onSubmit: {
          checks: [
            {
              type: "matches",
              message: "Passwords do not match",
              args: { other: { $data: "/password" } },
            },
          ],
        },
      },
    },
  ],
});

Auto-Derived Validators

Property	Validator
`required: true`	`required`
`minLength`	`minLength`
`maxLength`	`maxLength`
`criteria`	`passwordCriteria`

Password Field

On this page