nexwidget/dist/mixins/dependency-injection.js

An ESNext Web Component library.

export const WithDependencyConsumer = (Base) => {
  class WithDependencyConsumer extends Base {
    requestDependency(key) {
      const dependencyRequest = new CustomEvent('dependency-request', {
        detail: { key },
        composed: true,
        bubbles: true,
      });
      this.dispatchEvent(dependencyRequest);
      //@ts-ignore
      if (Object.hasOwn(dependencyRequest.detail, 'value'))
        return dependencyRequest.detail.value;
      else throw new RangeError(`No such dependency is provided.`);
    }
  }
  return WithDependencyConsumer;
};
export const WithDependencyProvider = (Base) => {
  class WithDependencyProvider extends Base {
    #dependencies = new Map();
    #handleRequest(event) {
      const { key } = event.detail;
      if (this.#dependencies.has(key)) {
        event.detail.value = this.#dependencies.get(key);
        event.stopPropagation();
      }
    }
    provideDependency(key, value) {
      this.#dependencies.set(key, value);
    }
    addedCallback() {
      super.addedCallback();
      this.addEventListener(
        'dependency-request',
        this.#handleRequest.bind(this),
        {
          signal: this.removedSignal,
        },
      );
    }
  }
  return WithDependencyProvider;
};