logo polydile dile-components


Mixins to apply more functionality to forms in order to generate some automatisms and avoid to duplicate code when you use forms in your applications.


npm i @dile/dile-form-mixin


To use DileFormMixin you only need to extend your custom element class with the mixin.

import { DileFormMixin } from '@dile/dile-form-mixin';

class MyElement extends DileFormMixin(HTMLElement) {
  // your custom element code...


This mixin apply some methods to the components to recognize and operate whith forms. To be recognized the form elements should have:

It works with native form elements or custom elements, as long as they have the value and name property.



  name: 'Please complete your name', 
  age: 'your age should be greater than 18 years old'

In the above code "name" and "age" are the name of the form element that shoud have a displayed error.

There is another requirement to display the error on the component.