@player-ui/metrics-plugin-react 0.0.1-next.1

package/dist/index.cjs.js

@@ -0,0 +1,59 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var metricsPlugin = require('@player-ui/metrics-plugin');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+class MetricsPlugin extends metricsPlugin.MetricsCorePlugin {
+  constructor(options) {
+    super(__spreadValues({
+      trackRenderTime: (_a = options == null ? void 0 : options.trackRenderTime) != null ? _a : true,
+      trackUpdateTime: (_b = options == null ? void 0 : options.trackUpdateTime) != null ? _b : true
+    }, options != null ? options : {}));
+    var _a, _b;
+  }
+  applyWeb(webPlayer) {
+    if (!this.trackRender) {
+      return;
+    }
+    const endRender = () => {
+      this.renderEnd();
+    };
+    webPlayer.hooks.playerComponent.tap(this.name, (Comp) => {
+      return (props) => {
+        React__default["default"].useEffect(endRender);
+        return /* @__PURE__ */ React__default["default"].createElement(Comp, __spreadValues({}, props));
+      };
+    });
+  }
+}
+
+exports.MetricsPlugin = MetricsPlugin;
+Object.keys(metricsPlugin).forEach(function (k) {
+  if (k !== 'default' && !exports.hasOwnProperty(k)) Object.defineProperty(exports, k, {
+    enumerable: true,
+    get: function () { return metricsPlugin[k]; }
+  });
+});
+//# sourceMappingURL=index.cjs.js.map

package/dist/index.d.ts

@@ -0,0 +1,11 @@
+import { WebPlayerPlugin, WebPlayer } from '@player-ui/react';
+import { MetricsCorePlugin, MetricsWebPluginOptions } from '@player-ui/metrics-plugin';
+export * from '@player-ui/metrics-plugin';
+
+/** A plugin to add render metrics to Player */
+declare class MetricsPlugin extends MetricsCorePlugin implements WebPlayerPlugin {
+    constructor(options?: MetricsWebPluginOptions);
+    applyWeb(webPlayer: WebPlayer): void;
+}
+
+export { MetricsPlugin };

package/dist/index.esm.js

@@ -0,0 +1,46 @@
+import React from 'react';
+import { MetricsCorePlugin } from '@player-ui/metrics-plugin';
+export * from '@player-ui/metrics-plugin';
+
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+class MetricsPlugin extends MetricsCorePlugin {
+  constructor(options) {
+    super(__spreadValues({
+      trackRenderTime: (_a = options == null ? void 0 : options.trackRenderTime) != null ? _a : true,
+      trackUpdateTime: (_b = options == null ? void 0 : options.trackUpdateTime) != null ? _b : true
+    }, options != null ? options : {}));
+    var _a, _b;
+  }
+  applyWeb(webPlayer) {
+    if (!this.trackRender) {
+      return;
+    }
+    const endRender = () => {
+      this.renderEnd();
+    };
+    webPlayer.hooks.playerComponent.tap(this.name, (Comp) => {
+      return (props) => {
+        React.useEffect(endRender);
+        return /* @__PURE__ */ React.createElement(Comp, __spreadValues({}, props));
+      };
+    });
+  }
+}
+
+export { MetricsPlugin };
+//# sourceMappingURL=index.esm.js.map

package/package.json

@@ -0,0 +1,19 @@
+{
+  "name": "@player-ui/metrics-plugin-react",
+  "version": "0.0.1-next.1",
+  "private": false,
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org"
+  },
+  "peerDependencies": {
+    "react": "^17.0.2",
+    "@player-ui/binding-grammar": "0.0.1-next.1"
+  },
+  "dependencies": {
+    "@player-ui/binding-grammar": "0.0.1-next.1",
+    "@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,40 @@
+import React from 'react';
+import type { WebPlayer, WebPlayerPlugin } from '@player-ui/react';
+import type { MetricsWebPluginOptions } from '@player-ui/metrics-plugin';
+import { MetricsCorePlugin } from '@player-ui/metrics-plugin';
+
+export * from '@player-ui/metrics-plugin';
+
+/** A plugin to add render metrics to Player */
+export class MetricsPlugin
+  extends MetricsCorePlugin
+  implements WebPlayerPlugin
+{
+  constructor(options?: MetricsWebPluginOptions) {
+    // Default to `true` for tracking metrics
+    super({
+      trackRenderTime: options?.trackRenderTime ?? true,
+      trackUpdateTime: options?.trackUpdateTime ?? true,
+      ...(options ?? {}),
+    });
+  }
+
+  applyWeb(webPlayer: WebPlayer) {
+    if (!this.trackRender) {
+      return;
+    }
+
+    /** Callback to complete the render lifecycle */
+    const endRender = () => {
+      this.renderEnd();
+    };
+
+    webPlayer.hooks.playerComponent.tap(this.name, (Comp) => {
+      return (props) => {
+        React.useEffect(endRender);
+
+        return <Comp {...props} />;
+      };
+    });
+  }
+}