A mixin to implement custom imput validator

Usage no npm install needed!

<script type="module">
  import advancedRestClientValidatorMixin from 'https://cdn.skypack.dev/@advanced-rest-client/validator-mixin';


Published on NPM

Build Status

Deprecation notice

This package is not maintained. Use @anypont-web-components/validator-mixin instead.


A port of iron-validator-behavior that works with any JavaScript class.

To be used with Polymer 3, LitElement and low level web components.

Use ValidatorMixin to implement a custom input/form validator.

Element instances implementing this mixin will be registered for use in elements that implement ValidatableMixin.

Validator name

By default it takes lower case name of current HTML element. If this class is used outside custom elements environment then it uses static is property to get the name of the validator.

static get is() {
 return 'my-validator';


npm i @advanced-rest-client/validator-mixin


import { LitElement } from 'lit-element';
import { ValidatorMixin } from '@advanced-rest-client/validator-mixin/validator-mixin.js';

class CatsOnly extends ValidatorMixin(LitElement) {
  validateObject(obj) {
    return !Object.keys(obj).some((key) => obj[key].match(/^(c|ca|cat|cats)?$/) === null);

  validateArray(value) {
    return !value.some((value) => value.match(/^(c|ca|cat|cats)?$/) === null);

  validate(values) {
    if (Array.isArray(values)) {
      return this.validateArray(values);
    if (typeof values === 'object') {
      return this.validateObject(values);
    return values.match(/^(c|ca|cat|cats)?$/) !== null;
window.customElements.define('cats-only', CatsOnly);


npm test


npm start

API components

This components is a part of API components ecosystem