import { createDispatchEvent } from '../helpers/mixinsHelpers';

export const changeMixin = (superclass) =>
  class ChangeMixinClass extends superclass {
    #dispatchChange = createDispatchEvent.bind(this, 'change');

    init() {
      super.init?.();
      this.prevValue = this.value;

      this.addEventListener('change', (e) => {
        e.stopPropagation();
      });

      this.addEventListener('blur', () => {
        if (this.value !== this.prevValue) {
          this.#dispatchChange();
          this.prevValue = this.value;
        }
      });
    }
  };
