Package Exports

@stoplight/lifecycle
@stoplight/lifecycle/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@stoplight/lifecycle) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@stoplight/lifecycle

Event and disposable helpers.

Explore the interfaces: TSDoc
View the changelog: Releases

Features

Disposable helpers.
Event emitter helpers.

Installation

Supported in modern browsers and node.

# latest stable
yarn add @stoplight/lifecycle

Usage

Disposables

A standardized way for things to declare how they cleanup. Simple example below:

import {
  DisposableCollection,
  EventEmitter,
  IDisposable
} from "@stoplight/lifecycle";

export class Editor implements IDisposable {
  // EventEmitter itself is an IDisposable
  public readonly valueEmitter = new EventEmitter<string, "didUpdate">();

  private readonly disposables: DisposableCollection = new DisposableCollection();

  constructor() {
    this.disposables.push(this.valueEmitter);
  }

  // Implement IDisposable
  dispose() {
    this.disposables.dispose();
  }
}

Emitter

A simple example editor that allows users to subscribe to value update events.

import { EventEmitter, IDisposable } from "@stoplight/lifecycle";

class Editor implements IDisposable {
  private _value = "";

  // create an emitter instance for this editor, defining the possible events and event object value
  private valueEmitter = new EventEmitter<string, "willUpdate" | "didUpdate">();

  get value() {
    return this._value;
  }

  set value(val: string) {
    this.valueEmitter.emit("willUpdate", this._value);
    this._value = val;
    this.valueEmitter.emit("didUpdate", this._value);
  }

  get onWillUpdateValue() {
    return this.valueEmitter.on("willUpdate");
  }

  get onDidUpdateValue() {
    return this.valueEmitter.on("didUpdate");
  }

  dispose() {
    // best practice to cleanup the emitter
    this.valueEmitter.dispose();
  }
}

const editor = new Editor();

const willUpdateListener = editor.onWillUpdateValue(val => {
  console.log("next value: ", val);
});

const didUpdateListener = editor.onDidUpdateValue(val => {
  console.log("new value: ", val);
});

// stop listening to willUpdate event
willUpdateListener.dispose();

Contributing

Clone repo.
Create / checkout feature/{name}, chore/{name}, or fix/{name} branch.
Install deps: yarn.
Make your changes.
Run tests: yarn test.prod.
Stage relevant files to git.
Commit: yarn commit. NOTE: Commits that don't follow the conventional format will be rejected. yarn commit creates this format for you, or you can put it together manually and then do a regular git commit.
Push: git push.
Open PR targeting the next branch.