Add View class?

[mbostock]

As shown in https://beta.observablehq.com/@mbostock/views-are-mutable-values

class View {
  constructor(value) {
    this._list = [];
    this._value = value;
  }
  get value() {
    return this._value;
  }
  set value(value) {
    this._value = value;
    this.dispatchEvent({type: "input", value});
  }
  addEventListener(type, listener) {
    if (type != "input" || this._list.includes(listener)) return;
    this._list = [listener].concat(this._list);
  }
  removeEventListener(type, listener) {
    if (type != "input") return;
    this._list = this._list.filter(l => l !== listener);
  }
  dispatchEvent(event) {
    const p = Promise.resolve(event);
    this._list.forEach(l => p.then(l));
  }
}

[mbostock]

Or even simpler:

class View extends EventTarget {
  constructor(value) {
    super();
    Object.defineProperties(this, {
      _value: {value, writable: true}
    });
  }
  get value() {
    return this._value;
  }
  set value(value) {
    this._value = value;
    this.dispatchEvent({type: "input", value});
  }
}

But Safari doesn’t support extending EventTarget yet, boo.

[mbostock]

Fixed in #207.

[mootari]

For reference, #207 adds @observablehq/inputs as a built-in, which in turn provides the inputs widget that matches the interface described above.