@player-ui/react-subscribe 0.0.1-next.1

package/dist/index.cjs.js

@@ -0,0 +1,130 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+function deferred() {
+  let resolve = () => void 0;
+  let reject = () => void 0;
+  let status = "pending";
+  const promise = new Promise((res, rej) => {
+    resolve = (a) => {
+      status = "success";
+      const resolveFunc = res;
+      resolveFunc(a);
+    };
+    reject = (error) => {
+      status = "failure";
+      rej(error);
+    };
+  });
+  return {
+    resolve,
+    status,
+    reject,
+    promise
+  };
+}
+const NOT_CALLED = Symbol("Subscribe -- Empty Value");
+class Subscribe {
+  constructor() {
+    this.callbacks = new Map();
+    this.deferredResult = deferred();
+    this.lastValue = NOT_CALLED;
+    this.resetDeferred = null;
+    this.publish = this.publish.bind(this);
+    this.add = this.add.bind(this);
+    this.remove = this.remove.bind(this);
+  }
+  publish(val) {
+    return __async(this, null, function* () {
+      var _a;
+      yield (_a = this.resetDeferred) == null ? void 0 : _a.promise;
+      this.lastValue = val;
+      this.deferredResult.resolve(val);
+      this.callbacks.forEach((c) => c(val));
+    });
+  }
+  add(callback, options) {
+    const id = this.callbacks.size;
+    this.callbacks.set(id, callback);
+    if (this.lastValue !== NOT_CALLED && (options == null ? void 0 : options.initializeWithPreviousValue) === true) {
+      callback(this.lastValue);
+    }
+    return id;
+  }
+  remove(id) {
+    this.callbacks.delete(id);
+  }
+  reset(promise) {
+    return __async(this, null, function* () {
+      var _a;
+      if (promise) {
+        this.resetDeferred = deferred();
+        yield promise;
+      }
+      if (this.lastValue !== NOT_CALLED) {
+        this.deferredResult = deferred();
+      }
+      this.lastValue = NOT_CALLED;
+      this.callbacks.forEach((c) => c(void 0));
+      (_a = this.resetDeferred) == null ? void 0 : _a.resolve();
+      this.resetDeferred = null;
+    });
+  }
+  suspend() {
+    if (this.lastValue === NOT_CALLED) {
+      throw this.deferredResult.promise;
+    }
+    return this.lastValue;
+  }
+  get() {
+    if (this.lastValue === NOT_CALLED) {
+      return void 0;
+    }
+    return this.lastValue;
+  }
+}
+function useSubscribedState(subscriber) {
+  const [state, setState] = React__default["default"].useState(subscriber.get());
+  React__default["default"].useEffect(() => {
+    const id = subscriber.add((resp) => {
+      setState(resp);
+    }, {
+      initializeWithPreviousValue: true
+    });
+    return () => {
+      subscriber.remove(id);
+    };
+  }, [subscriber]);
+  return state;
+}
+
+exports.Subscribe = Subscribe;
+exports.useSubscribedState = useSubscribedState;
+//# sourceMappingURL=index.cjs.js.map

package/dist/index.d.ts

@@ -0,0 +1,47 @@
+declare type SubscribeID = number;
+/**
+ * A pub-sub module that works across the React bridge
+ */
+declare class Subscribe<T> {
+    private callbacks;
+    private deferredResult;
+    private lastValue;
+    private resetDeferred;
+    constructor();
+    /**
+     * Trigger the subscriptions using the provided value
+     * if there is a reset in progress, wait for it before publishing a new value.
+     */
+    publish(val: T): Promise<void>;
+    /**
+     * Subscribe to updates
+     */
+    add(callback: (arg: T | undefined) => void, options?: {
+        /** Use the last updated value for this subscription to immediately trigger the onSet callback */
+        initializeWithPreviousValue?: boolean;
+    }): SubscribeID;
+    /**
+     * Remove any updates from the given listener
+     */
+    remove(id: SubscribeID): void;
+    /**
+     * Reset the state of the listener
+     * Passing in a promise will defer resetting the view until the promise is resolved
+     */
+    reset(promise?: Promise<void>): Promise<void>;
+    /**
+     * _Throws_ a promise if the value is still pending
+     * Otherwise returns it
+     */
+    suspend(): T;
+    /** Get the current value of the subscription  */
+    get(): T | undefined;
+}
+interface SubscribedStateHookOptions {
+    /** if the state should trigger suspense when waiting to resolve */
+    suspend?: boolean;
+}
+/** Subscribe to a state change event in a react component */
+declare function useSubscribedState<T>(subscriber: Subscribe<T>): T | undefined;
+
+export { Subscribe, SubscribeID, SubscribedStateHookOptions, useSubscribedState };

package/dist/index.esm.js

@@ -0,0 +1,121 @@
+import React from 'react';
+
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+function deferred() {
+  let resolve = () => void 0;
+  let reject = () => void 0;
+  let status = "pending";
+  const promise = new Promise((res, rej) => {
+    resolve = (a) => {
+      status = "success";
+      const resolveFunc = res;
+      resolveFunc(a);
+    };
+    reject = (error) => {
+      status = "failure";
+      rej(error);
+    };
+  });
+  return {
+    resolve,
+    status,
+    reject,
+    promise
+  };
+}
+const NOT_CALLED = Symbol("Subscribe -- Empty Value");
+class Subscribe {
+  constructor() {
+    this.callbacks = new Map();
+    this.deferredResult = deferred();
+    this.lastValue = NOT_CALLED;
+    this.resetDeferred = null;
+    this.publish = this.publish.bind(this);
+    this.add = this.add.bind(this);
+    this.remove = this.remove.bind(this);
+  }
+  publish(val) {
+    return __async(this, null, function* () {
+      var _a;
+      yield (_a = this.resetDeferred) == null ? void 0 : _a.promise;
+      this.lastValue = val;
+      this.deferredResult.resolve(val);
+      this.callbacks.forEach((c) => c(val));
+    });
+  }
+  add(callback, options) {
+    const id = this.callbacks.size;
+    this.callbacks.set(id, callback);
+    if (this.lastValue !== NOT_CALLED && (options == null ? void 0 : options.initializeWithPreviousValue) === true) {
+      callback(this.lastValue);
+    }
+    return id;
+  }
+  remove(id) {
+    this.callbacks.delete(id);
+  }
+  reset(promise) {
+    return __async(this, null, function* () {
+      var _a;
+      if (promise) {
+        this.resetDeferred = deferred();
+        yield promise;
+      }
+      if (this.lastValue !== NOT_CALLED) {
+        this.deferredResult = deferred();
+      }
+      this.lastValue = NOT_CALLED;
+      this.callbacks.forEach((c) => c(void 0));
+      (_a = this.resetDeferred) == null ? void 0 : _a.resolve();
+      this.resetDeferred = null;
+    });
+  }
+  suspend() {
+    if (this.lastValue === NOT_CALLED) {
+      throw this.deferredResult.promise;
+    }
+    return this.lastValue;
+  }
+  get() {
+    if (this.lastValue === NOT_CALLED) {
+      return void 0;
+    }
+    return this.lastValue;
+  }
+}
+function useSubscribedState(subscriber) {
+  const [state, setState] = React.useState(subscriber.get());
+  React.useEffect(() => {
+    const id = subscriber.add((resp) => {
+      setState(resp);
+    }, {
+      initializeWithPreviousValue: true
+    });
+    return () => {
+      subscriber.remove(id);
+    };
+  }, [subscriber]);
+  return state;
+}
+
+export { Subscribe, useSubscribedState };
+//# sourceMappingURL=index.esm.js.map

package/package.json

@@ -0,0 +1,19 @@
+{
+  "name": "@player-ui/react-subscribe",
+  "version": "0.0.1-next.1",
+  "private": false,
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org"
+  },
+  "peerDependencies": {
+    "@types/react": "^17.0.25",
+    "react": "^17.0.2"
+  },
+  "dependencies": {
+    "p-defer": "^3.0.0",
+    "@babel/runtime": "7.15.4"
+  },
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.esm.js",
+  "typings": "dist/index.d.ts"
+}

package/src/index.tsx

@@ -0,0 +1,177 @@
+import React from 'react';
+
+export type SubscribeID = number;
+
+type ResolveType<T> = (arg?: T) => void;
+type RejectType = (error?: Error) => void;
+type StatusType = 'success' | 'failure' | 'pending';
+type DefferedReturnType<T> = {
+  /** a function to resolve the promise */
+  resolve: ResolveType<T>;
+
+  /** a function to reject the promise */
+  reject: RejectType;
+
+  /** the status of the promise */
+  status: StatusType;
+
+  /** a promise to express the above */
+  promise: Promise<T>;
+};
+
+/** create a deferred promise */
+function deferred<T>(): DefferedReturnType<T> {
+  /** the default resolve handler is a noop */
+  let resolve: ResolveType<T> = () => undefined;
+
+  /** the default reject handler is a noop */
+  let reject: RejectType = () => undefined;
+
+  let status: StatusType = 'pending';
+
+  const promise = new Promise<T>((res, rej) => {
+    resolve = (a?: T) => {
+      status = 'success';
+      const resolveFunc = res as ResolveType<T>;
+      resolveFunc(a);
+    };
+
+    reject = (error?: Error) => {
+      status = 'failure';
+      rej(error);
+    };
+  });
+
+  return {
+    resolve,
+    status,
+    reject,
+    promise,
+  };
+}
+
+const NOT_CALLED = Symbol('Subscribe -- Empty Value');
+/**
+ * A pub-sub module that works across the React bridge
+ */
+export class Subscribe<T> {
+  private callbacks: Map<SubscribeID, (val: T | undefined) => void> = new Map();
+  private deferredResult = deferred<T>();
+  private lastValue: T | typeof NOT_CALLED = NOT_CALLED;
+  private resetDeferred: DefferedReturnType<void> | null = null;
+  constructor() {
+    this.publish = this.publish.bind(this);
+    this.add = this.add.bind(this);
+    this.remove = this.remove.bind(this);
+  }
+
+  /**
+   * Trigger the subscriptions using the provided value
+   * if there is a reset in progress, wait for it before publishing a new value.
+   */
+  async publish(val: T): Promise<void> {
+    await this.resetDeferred?.promise;
+    this.lastValue = val;
+    this.deferredResult.resolve(val);
+    this.callbacks.forEach((c) => c(val));
+  }
+
+  /**
+   * Subscribe to updates
+   */
+  add(
+    callback: (arg: T | undefined) => void,
+    options?: {
+      /** Use the last updated value for this subscription to immediately trigger the onSet callback */
+      initializeWithPreviousValue?: boolean;
+    }
+  ): SubscribeID {
+    const id = this.callbacks.size;
+    this.callbacks.set(id, callback);
+
+    if (
+      this.lastValue !== NOT_CALLED &&
+      options?.initializeWithPreviousValue === true
+    ) {
+      callback(this.lastValue);
+    }
+
+    return id;
+  }
+
+  /**
+   * Remove any updates from the given listener
+   */
+  remove(id: SubscribeID) {
+    this.callbacks.delete(id);
+  }
+
+  /**
+   * Reset the state of the listener
+   * Passing in a promise will defer resetting the view until the promise is resolved
+   */
+  async reset(promise?: Promise<void>) {
+    if (promise) {
+      this.resetDeferred = deferred<void>();
+      await promise;
+    }
+
+    if (this.lastValue !== NOT_CALLED) {
+      this.deferredResult = deferred();
+    }
+
+    this.lastValue = NOT_CALLED;
+    this.callbacks.forEach((c) => c(undefined));
+
+    this.resetDeferred?.resolve();
+    this.resetDeferred = null;
+  }
+
+  /**
+   * _Throws_ a promise if the value is still pending
+   * Otherwise returns it
+   */
+  suspend(): T {
+    if (this.lastValue === NOT_CALLED) {
+      throw this.deferredResult.promise;
+    }
+
+    return this.lastValue;
+  }
+
+  /** Get the current value of the subscription  */
+  get(): T | undefined {
+    if (this.lastValue === NOT_CALLED) {
+      return undefined;
+    }
+
+    return this.lastValue;
+  }
+}
+
+export interface SubscribedStateHookOptions {
+  /** if the state should trigger suspense when waiting to resolve */
+  suspend?: boolean;
+}
+
+/** Subscribe to a state change event in a react component */
+export function useSubscribedState<T>(subscriber: Subscribe<T>): T | undefined {
+  const [state, setState] = React.useState<T | undefined>(subscriber.get());
+
+  React.useEffect(() => {
+    const id = subscriber.add(
+      (resp) => {
+        setState(resp);
+      },
+      {
+        initializeWithPreviousValue: true,
+      }
+    );
+
+    return () => {
+      subscriber.remove(id);
+    };
+  }, [subscriber]);
+
+  return state;
+}