Skip to content

notchris/payload-mask-plugin

Repository files navigation

Payload Mask Plugin

Adds input masking to Payload.

image

Features:

  • Input masking using IMask

Basic Usage

Install the plugin and use on a text field in a Collection or Global.

Installation

yarn add payload-mask-plugin
// payload.config.ts
import { maskPlugin } from 'payload-mask-plugin'

export default buildConfig({
  ...
  plugins: [maskPlugin({ enabled: true })],
})
// Add to a text field on a Collection or Global

const Examples: CollectionConfig = {
  slug: "examples",
  fields: [
    {
      type: "text",
      name: "example_mask",
      label: "Input Mask Example",
      placeholder: "Enter a US phone number"

      custom: {
        mask: "+{1}(000)000-00-00",
        showValue: true,
        saveMaskedValue: false
      },
    },
  ],
};

export default Examples;