dreaction-client-core 1.0.0

package/lib/reactotron-core-client.js

@@ -0,0 +1,400 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ReactotronImpl = exports.corePlugins = exports.ArgType = exports.hasStateResponsePlugin = exports.assertHasStateResponsePlugin = exports.assertHasLoggerPlugin = void 0;
+exports.createClient = createClient;
+const validate_1 = __importDefault(require("./validate"));
+const logger_1 = __importDefault(require("./plugins/logger"));
+const image_1 = __importDefault(require("./plugins/image"));
+const benchmark_1 = __importDefault(require("./plugins/benchmark"));
+const state_responses_1 = __importDefault(require("./plugins/state-responses"));
+const api_response_1 = __importDefault(require("./plugins/api-response"));
+const clear_1 = __importDefault(require("./plugins/clear"));
+const repl_1 = __importDefault(require("./plugins/repl"));
+const serialize_1 = __importDefault(require("./serialize"));
+const stopwatch_1 = require("./stopwatch");
+var logger_2 = require("./plugins/logger");
+Object.defineProperty(exports, "assertHasLoggerPlugin", { enumerable: true, get: function () { return logger_2.assertHasLoggerPlugin; } });
+var state_responses_2 = require("./plugins/state-responses");
+Object.defineProperty(exports, "assertHasStateResponsePlugin", { enumerable: true, get: function () { return state_responses_2.assertHasStateResponsePlugin; } });
+Object.defineProperty(exports, "hasStateResponsePlugin", { enumerable: true, get: function () { return state_responses_2.hasStateResponsePlugin; } });
+var ArgType;
+(function (ArgType) {
+    ArgType["String"] = "string";
+})(ArgType || (exports.ArgType = ArgType = {}));
+exports.corePlugins = [
+    (0, image_1.default)(),
+    (0, logger_1.default)(),
+    (0, benchmark_1.default)(),
+    (0, state_responses_1.default)(),
+    (0, api_response_1.default)(),
+    (0, clear_1.default)(),
+    (0, repl_1.default)(),
+];
+// these are not for you.
+const reservedFeatures = [
+    'configure',
+    'connect',
+    'connected',
+    'options',
+    'plugins',
+    'send',
+    'socket',
+    'startTimer',
+    'use',
+];
+const isReservedFeature = (value) => reservedFeatures.some((res) => res === value);
+function emptyPromise() {
+    return Promise.resolve('');
+}
+class ReactotronImpl {
+    // the configuration options
+    options;
+    /**
+     * Are we connected to a server?
+     */
+    connected = false;
+    /**
+     * The socket we're using.
+     */
+    socket = null;
+    /**
+     * Available plugins.
+     */
+    plugins = [];
+    /**
+     * Messages that need to be sent.
+     */
+    sendQueue = [];
+    /**
+     * Are we ready to start communicating?
+     */
+    isReady = false;
+    /**
+     * The last time we sent a message.
+     */
+    lastMessageDate = new Date();
+    /**
+     * The registered custom commands
+     */
+    customCommands = [];
+    /**
+     * The current ID for custom commands
+     */
+    customCommandLatestId = 1;
+    /**
+     * Starts a timer and returns a function you can call to stop it and return the elapsed time.
+     */
+    startTimer = () => (0, stopwatch_1.start)();
+    /**
+     * Set the configuration options.
+     */
+    configure(options) {
+        // options get merged & validated before getting set
+        const newOptions = Object.assign({
+            createSocket: null,
+            host: 'localhost',
+            port: 9090,
+            name: 'reactotron-core-client',
+            secure: false,
+            plugins: exports.corePlugins,
+            safeRecursion: true,
+            onCommand: () => null,
+            onConnect: () => null,
+            onDisconnect: () => null,
+        }, this.options, options);
+        (0, validate_1.default)(newOptions);
+        this.options = newOptions;
+        // if we have plugins, let's add them here
+        if (Array.isArray(this.options.plugins)) {
+            this.options.plugins.forEach((p) => this.use(p));
+        }
+        return this;
+    }
+    close() {
+        this.connected = false;
+        this.socket && this.socket.close && this.socket.close();
+    }
+    /**
+     * Connect to the Reactotron server.
+     */
+    connect() {
+        this.connected = true;
+        const { createSocket, secure, host, environment, port, name, client = {}, getClientId, } = this.options;
+        const { onCommand, onConnect, onDisconnect } = this.options;
+        // establish a connection to the server
+        const protocol = secure ? 'wss' : 'ws';
+        const socket = createSocket(`${protocol}://${host}:${port}`);
+        // fires when we talk to the server
+        const onOpen = () => {
+            // fire our optional onConnect handler
+            onConnect && onConnect();
+            // trigger our plugins onConnect
+            this.plugins.forEach((p) => p.onConnect && p.onConnect());
+            const getClientIdPromise = getClientId || emptyPromise;
+            getClientIdPromise(name).then((clientId) => {
+                this.isReady = true;
+                // introduce ourselves
+                this.send('client.intro', {
+                    environment,
+                    ...client,
+                    name,
+                    clientId,
+                    reactotronCoreClientVersion: 'REACTOTRON_CORE_CLIENT_VERSION',
+                });
+                // flush the send queue
+                while (this.sendQueue.length > 0) {
+                    const h = this.sendQueue[0];
+                    this.sendQueue = this.sendQueue.slice(1);
+                    this.socket.send(h);
+                }
+            });
+        };
+        // fires when we disconnect
+        const onClose = () => {
+            this.isReady = false;
+            // trigger our disconnect handler
+            onDisconnect && onDisconnect();
+            // as well as the plugin's onDisconnect
+            this.plugins.forEach((p) => p.onDisconnect && p.onDisconnect());
+        };
+        const decodeCommandData = (data) => {
+            if (typeof data === 'string') {
+                return JSON.parse(data);
+            }
+            if (Buffer.isBuffer(data)) {
+                return JSON.parse(data.toString());
+            }
+            return data;
+        };
+        // fires when we receive a command, just forward it off
+        const onMessage = (data) => {
+            const command = decodeCommandData(data);
+            // trigger our own command handler
+            onCommand && onCommand(command);
+            // trigger our plugins onCommand
+            this.plugins.forEach((p) => p.onCommand && p.onCommand(command));
+            // trigger our registered custom commands
+            if (command.type === 'custom') {
+                this.customCommands
+                    .filter((cc) => {
+                    if (typeof command.payload === 'string') {
+                        return cc.command === command.payload;
+                    }
+                    return cc.command === command.payload.command;
+                })
+                    .forEach((cc) => cc.handler(typeof command.payload === 'object'
+                    ? command.payload.args
+                    : undefined));
+            }
+            else if (command.type === 'setClientId') {
+                this.options.setClientId && this.options.setClientId(command.payload);
+            }
+        };
+        // this is ws style from require('ws') on node js
+        if ('on' in socket && socket.on) {
+            const nodeWebSocket = socket;
+            nodeWebSocket.on('open', onOpen);
+            nodeWebSocket.on('close', onClose);
+            nodeWebSocket.on('message', onMessage);
+            // assign the socket to the instance
+            this.socket = socket;
+        }
+        else {
+            // this is a browser
+            const browserWebSocket = socket;
+            socket.onopen = onOpen;
+            socket.onclose = onClose;
+            socket.onmessage = (evt) => onMessage(evt.data);
+            // assign the socket to the instance
+            this.socket = browserWebSocket;
+        }
+        return this;
+    }
+    /**
+     * Sends a command to the server
+     */
+    send = (type, payload, important) => {
+        // set the timing info
+        const date = new Date();
+        let deltaTime = date.getTime() - this.lastMessageDate.getTime();
+        // glitches in the matrix
+        if (deltaTime < 0) {
+            deltaTime = 0;
+        }
+        this.lastMessageDate = date;
+        const fullMessage = {
+            type,
+            payload,
+            important: !!important,
+            date: date.toISOString(),
+            deltaTime,
+        };
+        const serializedMessage = (0, serialize_1.default)(fullMessage, this.options.proxyHack);
+        if (this.isReady) {
+            // send this command
+            try {
+                this.socket.send(serializedMessage);
+            }
+            catch {
+                this.isReady = false;
+                console.log('An error occurred communicating with reactotron. Please reload your app');
+            }
+        }
+        else {
+            // queue it up until we can connect
+            this.sendQueue.push(serializedMessage);
+        }
+    };
+    /**
+     * Sends a custom command to the server to displays nicely.
+     */
+    display(config) {
+        const { name, value, preview, image: img, important = false } = config;
+        const payload = {
+            name,
+            value: value || null,
+            preview: preview || null,
+            image: img || null,
+        };
+        this.send('display', payload, important);
+    }
+    /**
+     * Client libraries can hijack this to report errors.
+     */
+    reportError(error) {
+        this.error(error);
+    }
+    /**
+     * Adds a plugin to the system
+     */
+    use(pluginCreator) {
+        // we're supposed to be given a function
+        if (typeof pluginCreator !== 'function') {
+            throw new Error('plugins must be a function');
+        }
+        // execute it immediately passing the send function
+        const plugin = pluginCreator.bind(this)(this);
+        // ensure we get an Object-like creature back
+        if (typeof plugin !== 'object') {
+            throw new Error('plugins must return an object');
+        }
+        // do we have features to mixin?
+        if (plugin.features) {
+            // validate
+            if (typeof plugin.features !== 'object') {
+                throw new Error('features must be an object');
+            }
+            // here's how we're going to inject these in
+            const inject = (key) => {
+                // grab the function
+                const featureFunction = plugin.features[key];
+                // only functions may pass
+                if (typeof featureFunction !== 'function') {
+                    throw new Error(`feature ${key} is not a function`);
+                }
+                // ditch reserved names
+                if (isReservedFeature(key)) {
+                    throw new Error(`feature ${key} is a reserved name`);
+                }
+                // ok, let's glue it up... and lose all respect from elite JS champions.
+                this[key] = featureFunction;
+            };
+            // let's inject
+            Object.keys(plugin.features).forEach((key) => inject(key));
+        }
+        // add it to the list
+        this.plugins.push(plugin);
+        // call the plugins onPlugin
+        plugin.onPlugin &&
+            typeof plugin.onPlugin === 'function' &&
+            plugin.onPlugin.bind(this)(this);
+        // chain-friendly
+        return this;
+    }
+    onCustomCommand(config, optHandler) {
+        let command;
+        let handler;
+        let title;
+        let description;
+        let args;
+        if (typeof config === 'string') {
+            command = config;
+            handler = optHandler;
+        }
+        else {
+            command = config.command;
+            handler = config.handler;
+            title = config.title;
+            description = config.description;
+            args = config.args;
+        }
+        // Validations
+        // Make sure there is a command
+        if (!command) {
+            throw new Error('A command is required');
+        }
+        // Make sure there is a handler
+        if (!handler) {
+            throw new Error(`A handler is required for command "${command}"`);
+        }
+        // Make sure the command doesn't already exist
+        const existingCommands = this.customCommands.filter((cc) => cc.command === command);
+        if (existingCommands.length > 0) {
+            existingCommands.forEach((command) => {
+                this.customCommands = this.customCommands.filter((cc) => cc.id !== command.id);
+                this.send('customCommand.unregister', {
+                    id: command.id,
+                    command: command.command,
+                });
+            });
+        }
+        if (args) {
+            const argNames = [];
+            args.forEach((arg) => {
+                if (!arg.name) {
+                    throw new Error(`A arg on the command "${command}" is missing a name`);
+                }
+                if (argNames.indexOf(arg.name) > -1) {
+                    throw new Error(`A arg with the name "${arg.name}" already exists in the command "${command}"`);
+                }
+                argNames.push(arg.name);
+            });
+        }
+        // Create this command handlers object
+        const customHandler = {
+            id: this.customCommandLatestId,
+            command,
+            handler,
+            title,
+            description,
+            args,
+        };
+        // Increment our id counter
+        this.customCommandLatestId += 1;
+        // Add it to our array
+        this.customCommands.push(customHandler);
+        this.send('customCommand.register', {
+            id: customHandler.id,
+            command: customHandler.command,
+            title: customHandler.title,
+            description: customHandler.description,
+            args: customHandler.args,
+        });
+        return () => {
+            this.customCommands = this.customCommands.filter((cc) => cc.id !== customHandler.id);
+            this.send('customCommand.unregister', {
+                id: customHandler.id,
+                command: customHandler.command,
+            });
+        };
+    }
+}
+exports.ReactotronImpl = ReactotronImpl;
+// convenience factory function
+function createClient(options) {
+    const client = new ReactotronImpl();
+    return client.configure(options);
+}

package/lib/serialize.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Fix BigInt serialization
+ * BigInts are not supported by JSON.stringify in Hermes android.
+ * This is a workaround.
+ * https://github.com/GoogleChromeLabs/jsbi/issues/30#issuecomment-953187833
+ * https://github.com/infinitered/reactotron/issues/1436
+ */
+declare global {
+    interface BigInt {
+        toJSON(): string;
+    }
+}
+/**
+ * Serializes an object to JSON.
+ *
+ *  @param {any} source - The victim.
+ */
+declare function serialize(source: any, proxyHack?: boolean): string;
+export default serialize;
+//# sourceMappingURL=serialize.d.ts.map

package/lib/serialize.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"serialize.d.ts","sourceRoot":"","sources":["../src/serialize.ts"],"names":[],"mappings":"AAiBA;;;;;;GAMG;AACH,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,MAAM,IAAI,MAAM,CAAC;KAClB;CACF;AAsBD;;;;GAIG;AACH,iBAAS,SAAS,CAAC,MAAM,EAAE,GAAG,EAAE,SAAS,UAAQ,UAmEhD;AAED,eAAe,SAAS,CAAC"}

package/lib/serialize.js

@@ -0,0 +1,112 @@
+"use strict";
+// JSON.stringify() doesn't support circular dependencies or keeping
+// falsy values.  This does.
+//
+// Mostly adapted from https://github.com/isaacs/json-stringify-safe
+Object.defineProperty(exports, "__esModule", { value: true });
+// replacement tokens
+const UNDEFINED = '~~~ undefined ~~~';
+const NULL = `~~~ null ~~~`;
+const FALSE = `~~~ false ~~~`;
+const ZERO = `~~~ zero ~~~`;
+const EMPTY_STRING = `~~~ empty string ~~~`;
+const CIRCULAR = '~~~ Circular Reference ~~~';
+const ANONYMOUS = '~~~ anonymous function ~~~';
+const INFINITY = '~~~ Infinity ~~~';
+const NEGATIVE_INFINITY = '~~~ -Infinity ~~~';
+if (typeof BigInt !== 'undefined') {
+    // eslint-disable-next-line no-extend-native
+    BigInt.prototype.toJSON = function () {
+        return this.toString();
+    };
+}
+/**
+ * Attempts to give a name to a function.
+ *
+ * @param {Function} fn - The function to name.
+ */
+function getFunctionName(fn) {
+    const n = fn.name;
+    if (n === null || n === undefined || n === '') {
+        return ANONYMOUS;
+    }
+    else {
+        return `~~~ ${n}() ~~~`;
+    }
+}
+/**
+ * Serializes an object to JSON.
+ *
+ *  @param {any} source - The victim.
+ */
+function serialize(source, proxyHack = false) {
+    const stack = [];
+    const keys = [];
+    /**
+     * Replace this object node with something potentially custom.
+     *
+     * @param {*} key - The key currently visited.
+     * @param {*} value - The value to replace.
+     */
+    function serializer(replacer) {
+        return function (key, value) {
+            // slam dunks
+            if (value === true)
+                return true;
+            // weird stuff
+            // if (Object.is(value, NaN)) return NAN // OK, apparently this is hard... leaving out for now
+            if (value === Infinity)
+                return INFINITY;
+            if (value === -Infinity)
+                return NEGATIVE_INFINITY;
+            if (value === 0)
+                return ZERO;
+            // classic javascript
+            if (value === undefined)
+                return UNDEFINED;
+            if (value === null)
+                return NULL;
+            if (value === false)
+                return FALSE;
+            // head shakers
+            if (value === -0)
+                return ZERO; // eslint-disable-line
+            if (value === '')
+                return EMPTY_STRING;
+            if (proxyHack && typeof value === 'object' && value.nativeEvent) {
+                return value.nativeEvent;
+            }
+            // known types that have easy resolving
+            switch (typeof value) {
+                case 'string':
+                    return value;
+                case 'number':
+                    return value;
+                case 'bigint':
+                    return value.toString();
+                case 'function':
+                    return getFunctionName(value);
+            }
+            // Tough things to crack
+            // If we have an iterator but are not an array (because arrays are easily seralizeable already)...
+            if (value[Symbol.iterator] && !Array.isArray(value)) {
+                // Convert to an array!
+                return [...value];
+            }
+            if (stack.length > 0) {
+                // check for prior existance
+                const thisPos = stack.indexOf(this);
+                ~thisPos ? stack.splice(thisPos + 1) : stack.push(this);
+                ~thisPos ? keys.splice(thisPos, Infinity, key) : keys.push(key);
+                if (~stack.indexOf(value))
+                    value = CIRCULAR;
+            }
+            else {
+                stack.push(value);
+            }
+            return replacer == null ? value : replacer.call(this, key, value);
+        };
+    }
+    return JSON.stringify(source, serializer(null));
+}
+exports.default = serialize;

package/lib/stopwatch.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Starts a lame, low-res timer.  Returns a function which when invoked,
+ * gives you the number of milliseconds since passing.  ish.
+ */
+export declare const start: () => () => number;
+//# sourceMappingURL=stopwatch.d.ts.map

package/lib/stopwatch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stopwatch.d.ts","sourceRoot":"","sources":["../src/stopwatch.ts"],"names":[],"mappings":"AAyCA;;;GAGG;AACH,eAAO,MAAM,KAAK,oBAIjB,CAAC"}

package/lib/stopwatch.js

@@ -0,0 +1,45 @@
+"use strict";
+/// <reference types="node" />
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.start = void 0;
+const hasHirezNodeTimer = false &&
+    typeof process === 'object' &&
+    process &&
+    process.hrtime &&
+    typeof process.hrtime === 'function';
+// the default timer
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+const defaultPerformanceNow = (started) => Date.now();
+// try to find the browser-based performance timer
+const nativePerformance = typeof window !== 'undefined' &&
+    window &&
+    (window.performance ||
+        window.msPerformance ||
+        window.webkitPerformance);
+// the function we're trying to assign
+let performanceNow = defaultPerformanceNow;
+// accepts an already started time and returns the number of milliseconds
+let delta = (started) => performanceNow() - started;
+if (hasHirezNodeTimer) {
+    performanceNow = process.hrtime;
+    // delta = (started) => performanceNow(started)[1] / 1000000;
+    delta = (started) => performanceNow(started) / 1000000;
+}
+else if (global.nativePerformanceNow) {
+    // react native 47
+    performanceNow = global.nativePerformanceNow;
+}
+else if (nativePerformance) {
+    // browsers + safely check for react native < 47
+    performanceNow = () => nativePerformance.now && nativePerformance.now();
+}
+/**
+ * Starts a lame, low-res timer.  Returns a function which when invoked,
+ * gives you the number of milliseconds since passing.  ish.
+ */
+const start = () => {
+    //  record the start time
+    const started = performanceNow();
+    return () => delta(started);
+};
+exports.start = start;

package/lib/validate.d.ts

@@ -0,0 +1,9 @@
+import type { ClientOptions } from './client-options';
+import type { DReactionCore } from './';
+/**
+ * Ensures the options are sane to run this baby.  Throw if not.  These
+ * are basically sanity checks.
+ */
+declare const validate: (options: ClientOptions<DReactionCore>) => void;
+export default validate;
+//# sourceMappingURL=validate.d.ts.map

package/lib/validate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"validate.d.ts","sourceRoot":"","sources":["../src/validate.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,IAAI,CAAC;AAYxC;;;GAGG;AACH,QAAA,MAAM,QAAQ,YAAa,aAAa,CAAC,aAAa,CAAC,SAkBtD,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/lib/validate.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const isCreateSocketValid = (createSocket) => typeof createSocket !== 'undefined' && createSocket !== null;
+const isHostValid = (host) => (typeof host === 'string' && host && host !== '');
+const isPortValid = (port) => typeof port === 'number' && port >= 1 && port <= 65535;
+const onCommandValid = (fn) => typeof fn === 'function';
+/**
+ * Ensures the options are sane to run this baby.  Throw if not.  These
+ * are basically sanity checks.
+ */
+const validate = (options) => {
+    const { createSocket, host, port, onCommand } = options;
+    if (!isCreateSocketValid(createSocket)) {
+        throw new Error('invalid createSocket function');
+    }
+    if (!isHostValid(host)) {
+        throw new Error('invalid host');
+    }
+    if (!isPortValid(port)) {
+        throw new Error('invalid port');
+    }
+    if (!onCommandValid(onCommand)) {
+        throw new Error('invalid onCommand handler');
+    }
+};
+exports.default = validate;

package/package.json

@@ -0,0 +1,29 @@
+{
+  "name": "dreaction-client-core",
+  "version": "1.0.0",
+  "private": false,
+  "description": "",
+  "main": "lib/index.js",
+  "files": [
+    "lib",
+    "src"
+  ],
+  "keywords": [
+    "dreaction"
+  ],
+  "author": "moonrailgun <moonrailgun@gmail.com>",
+  "license": "MIT",
+  "dependencies": {
+    "@types/ws": "^8.5.13",
+    "eventemitter-strict": "^1.0.1",
+    "ws": "^8.18.0",
+    "dreaction-protocol": "1.0.0"
+  },
+  "devDependencies": {
+    "typescript": "^5.4.5"
+  },
+  "scripts": {
+    "build": "tsc",
+    "test": "vitest"
+  }
+}