@player-ui/react 0.15.3 → 0.15.4--canary.881.37421

package/dist/index.legacy-esm.js

@@ -4,7 +4,11 @@ export * from "@player-ui/player";
 // ../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/react/player/src/player.tsx
 import React4 from "react";
 import { SyncWaterfallHook, AsyncParallelHook } from "tapable-ts";
-import { Subscribe, useSubscribedState } from "@player-ui/react-subscribe";
+import {
+  Subscribe,
+  useSubscribedState,
+  useSubscriber
+} from "@player-ui/react-subscribe";
 import { Registry } from "@player-ui/partial-match-registry";
 import { Player } from "@player-ui/player";
 import { ErrorBoundary as ErrorBoundary2 } from "react-error-boundary";
@@ -15,12 +19,21 @@ import leven from "leven";
 import { ErrorBoundary } from "react-error-boundary";
 
 // ../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/react/player/src/asset/AssetRenderError.ts
+import {
+  ErrorSeverity,
+  ErrorTypes
+} from "@player-ui/player";
 var AssetRenderError = class extends Error {
   constructor(rootAsset, message, innerException) {
     super(message);
     this.rootAsset = rootAsset;
     this.innerException = innerException;
     this.assetParentPath = [];
+    this.type = ErrorTypes.RENDER;
+    this.severity = ErrorSeverity.ERROR;
+    this.metadata = {
+      assetId: rootAsset.id
+    };
     this.initialMessage = message ?? "";
     this.innerExceptionMessage = innerException instanceof Error ? innerException.message : String(innerException);
     if (this.innerExceptionMessage) {
@@ -124,6 +137,7 @@ var ReactAsset = (props) => {
             error
           );
         }
+        return null;
       }
     },
     /* @__PURE__ */ React.createElement(Impl, { key: unwrapped.id, ...unwrapped })
@@ -241,6 +255,7 @@ var OnUpdatePlugin = class {
 };
 
 // ../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/react/player/src/player.tsx
+var ReactPlayerPropsContext = React4.createContext({ isInErrorState: false });
 var _window = typeof window === "undefined" ? void 0 : window;
 var ReactPlayer2 = class {
   constructor(options) {
@@ -301,10 +316,16 @@ var ReactPlayer2 = class {
   }
   /** Register and apply [Plugin] if one with the same symbol is not already registered. */
   registerPlugin(plugin) {
-    if (!plugin.applyReact)
-      return;
-    plugin.applyReact(this);
-    this.options.plugins?.push(plugin);
+    if (plugin.apply) {
+      this.player.registerPlugin(plugin);
+    }
+    if (plugin.applyReact) {
+      plugin.applyReact?.(this);
+    }
+    if (!this.options.plugins) {
+      this.options.plugins = [];
+    }
+    this.options.plugins.push(plugin);
   }
   /**
    * Returns the current version of the running React Player
@@ -323,18 +344,84 @@ var ReactPlayer2 = class {
   createReactPlayerComponent() {
     const BaseComp = this.hooks.webComponent.call(this.createReactComp());
     const ReactPlayerComponent = (props) => {
+      const trackedErrors = React4.useRef(/* @__PURE__ */ new Map());
+      const [errorSubId, setErrorSubId] = React4.useState(
+        void 0
+      );
+      const { subscribe, unsubscribe } = useSubscriber(
+        this.viewUpdateSubscription
+      );
+      const componentProps = React4.useMemo(
+        () => ({
+          ...props,
+          isInErrorState: errorSubId !== void 0
+        }),
+        [props, errorSubId]
+      );
+      const clearErrorTracking = React4.useCallback(() => {
+        trackedErrors.current.clear();
+        setErrorSubId((prev) => {
+          if (prev !== void 0) {
+            unsubscribe(prev);
+          }
+          return void 0;
+        });
+      }, []);
+      React4.useEffect(() => {
+        return clearErrorTracking;
+      }, [clearErrorTracking]);
+      const captureError = React4.useCallback(
+        (err) => {
+          const playerState = this.player.getState();
+          if (playerState.status !== "in-progress") {
+            this.player.logger.warn(
+              `[ReactPlayer]: An error occurred during rendering but was ignored due to a change in the player state (current state: '${playerState.status}'). Error Details:`,
+              err
+            );
+            return false;
+          }
+          const currentError = trackedErrors.current.get(err);
+          if (currentError !== void 0) {
+            return currentError;
+          }
+          let isRecovering = false;
+          setErrorSubId((prev) => {
+            const subId = prev === void 0 ? subscribe(clearErrorTracking, {
+              initializeWithPreviousValue: false
+            }) : prev;
+            isRecovering = playerState.controllers.error.captureError(err);
+            trackedErrors.current.set(err, isRecovering);
+            if (!isRecovering) {
+              if (subId !== prev) {
+                unsubscribe(subId);
+              }
+              return prev;
+            }
+            return subId;
+          });
+          return isRecovering;
+        },
+        [errorSubId]
+      );
       return /* @__PURE__ */ React4.createElement(
         ErrorBoundary2,
         {
-          fallbackRender: () => null,
-          onError: (err) => {
-            const playerState = this.player.getState();
-            if (playerState.status === "in-progress") {
-              playerState.fail(err);
+          fallbackRender: (fallbackProps) => {
+            const isRecovering = captureError(fallbackProps.error);
+            if (!isRecovering) {
+              return null;
             }
+            fallbackProps.resetErrorBoundary();
+            return /* @__PURE__ */ React4.createElement(
+              ReactPlayerPropsContext.Provider,
+              {
+                value: { ...componentProps, isInErrorState: true }
+              },
+              /* @__PURE__ */ React4.createElement(PlayerContext.Provider, { value: { player: this.player } }, /* @__PURE__ */ React4.createElement(BaseComp, { ...componentProps, isInErrorState: true }))
+            );
           }
         },
-        /* @__PURE__ */ React4.createElement(PlayerContext.Provider, { value: { player: this.player } }, /* @__PURE__ */ React4.createElement(BaseComp, { ...props }))
+        /* @__PURE__ */ React4.createElement(ReactPlayerPropsContext.Provider, { value: { ...componentProps } }, /* @__PURE__ */ React4.createElement(PlayerContext.Provider, { value: { player: this.player } }, /* @__PURE__ */ React4.createElement(BaseComp, { ...componentProps })))
       );
     };
     return ReactPlayerComponent;
@@ -342,8 +429,16 @@ var ReactPlayer2 = class {
   createReactComp() {
     const ActualPlayerComp = this.hooks.playerComponent.call(ReactPlayer);
     const WebPlayerComponent = () => {
+      const { isInErrorState } = React4.useContext(ReactPlayerPropsContext);
       const view = useSubscribedState(this.viewUpdateSubscription);
+      const lastSuccessfulView = React4.useRef(void 0);
       this.viewUpdateSubscription.suspend();
+      React4.useEffect(() => {
+        if (!isInErrorState) {
+          lastSuccessfulView.current = view;
+        }
+      }, [isInErrorState, view]);
+      const displayedView = isInErrorState ? lastSuccessfulView.current : view;
       return /* @__PURE__ */ React4.createElement(
         AssetContext.Provider,
         {
@@ -351,7 +446,7 @@ var ReactPlayer2 = class {
             registry: this.assetRegistry
           }
         },
-        view && /* @__PURE__ */ React4.createElement(ActualPlayerComp, { view })
+        displayedView && /* @__PURE__ */ React4.createElement(ActualPlayerComp, { view: displayedView })
       );
     };
     return WebPlayerComponent;
@@ -626,9 +721,7 @@ var usePersistentStateMachine = (options) => {
     if (oldManagedState) {
       const playerState = oldManagedState.state?.context.reactPlayer.player.getState();
       if (oldManagedState.state?.value === "running" && playerState?.status === "in-progress") {
-        previousManager.current.terminate?.(
-          playerState.controllers.data.serialize()
-        );
+        previousManager.current.terminate?.(playerState);
       }
     }
     const newKey = createKey();
@@ -685,7 +778,7 @@ var ManagedPlayer = (props) => {
     } else if (state?.value === "error") {
       props.onError?.(state?.context.error);
     } else if (state?.value === "running") {
-      props.onStartedFlow?.();
+      props.onStartedFlow?.(state.context.flow);
     }
   }
   previousState.current = state;
@@ -693,7 +786,7 @@ var ManagedPlayer = (props) => {
     return () => {
       const playerState = state?.context.reactPlayer.player.getState();
       if (state?.value === "running" && playerState?.status === "in-progress") {
-        props.manager.terminate?.(playerState.controllers.data.serialize());
+        props.manager.terminate?.(playerState);
       }
     };
   }, [props.manager, state?.context.reactPlayer.player, state?.value]);
@@ -729,6 +822,7 @@ export {
   PlayerContext,
   ReactAsset,
   ReactPlayer2 as ReactPlayer,
+  ReactPlayerPropsContext,
   WebPlayer,
   buildUrl,
   callOrReturn,

package/dist/index.mjs

@@ -4,7 +4,11 @@ export * from "@player-ui/player";
 // ../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/react/player/src/player.tsx
 import React4 from "react";
 import { SyncWaterfallHook, AsyncParallelHook } from "tapable-ts";
-import { Subscribe, useSubscribedState } from "@player-ui/react-subscribe";
+import {
+  Subscribe,
+  useSubscribedState,
+  useSubscriber
+} from "@player-ui/react-subscribe";
 import { Registry } from "@player-ui/partial-match-registry";
 import { Player } from "@player-ui/player";
 import { ErrorBoundary as ErrorBoundary2 } from "react-error-boundary";
@@ -15,12 +19,21 @@ import leven from "leven";
 import { ErrorBoundary } from "react-error-boundary";
 
 // ../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/react/player/src/asset/AssetRenderError.ts
+import {
+  ErrorSeverity,
+  ErrorTypes
+} from "@player-ui/player";
 var AssetRenderError = class extends Error {
   constructor(rootAsset, message, innerException) {
     super(message);
     this.rootAsset = rootAsset;
     this.innerException = innerException;
     this.assetParentPath = [];
+    this.type = ErrorTypes.RENDER;
+    this.severity = ErrorSeverity.ERROR;
+    this.metadata = {
+      assetId: rootAsset.id
+    };
     this.initialMessage = message ?? "";
     this.innerExceptionMessage = innerException instanceof Error ? innerException.message : String(innerException);
     if (this.innerExceptionMessage) {
@@ -124,6 +137,7 @@ var ReactAsset = (props) => {
             error
           );
         }
+        return null;
       }
     },
     /* @__PURE__ */ React.createElement(Impl, { key: unwrapped.id, ...unwrapped })
@@ -241,6 +255,7 @@ var OnUpdatePlugin = class {
 };
 
 // ../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/react/player/src/player.tsx
+var ReactPlayerPropsContext = React4.createContext({ isInErrorState: false });
 var _window = typeof window === "undefined" ? void 0 : window;
 var ReactPlayer2 = class {
   constructor(options) {
@@ -301,10 +316,16 @@ var ReactPlayer2 = class {
   }
   /** Register and apply [Plugin] if one with the same symbol is not already registered. */
   registerPlugin(plugin) {
-    if (!plugin.applyReact)
-      return;
-    plugin.applyReact(this);
-    this.options.plugins?.push(plugin);
+    if (plugin.apply) {
+      this.player.registerPlugin(plugin);
+    }
+    if (plugin.applyReact) {
+      plugin.applyReact?.(this);
+    }
+    if (!this.options.plugins) {
+      this.options.plugins = [];
+    }
+    this.options.plugins.push(plugin);
   }
   /**
    * Returns the current version of the running React Player
@@ -323,18 +344,84 @@ var ReactPlayer2 = class {
   createReactPlayerComponent() {
     const BaseComp = this.hooks.webComponent.call(this.createReactComp());
     const ReactPlayerComponent = (props) => {
+      const trackedErrors = React4.useRef(/* @__PURE__ */ new Map());
+      const [errorSubId, setErrorSubId] = React4.useState(
+        void 0
+      );
+      const { subscribe, unsubscribe } = useSubscriber(
+        this.viewUpdateSubscription
+      );
+      const componentProps = React4.useMemo(
+        () => ({
+          ...props,
+          isInErrorState: errorSubId !== void 0
+        }),
+        [props, errorSubId]
+      );
+      const clearErrorTracking = React4.useCallback(() => {
+        trackedErrors.current.clear();
+        setErrorSubId((prev) => {
+          if (prev !== void 0) {
+            unsubscribe(prev);
+          }
+          return void 0;
+        });
+      }, []);
+      React4.useEffect(() => {
+        return clearErrorTracking;
+      }, [clearErrorTracking]);
+      const captureError = React4.useCallback(
+        (err) => {
+          const playerState = this.player.getState();
+          if (playerState.status !== "in-progress") {
+            this.player.logger.warn(
+              `[ReactPlayer]: An error occurred during rendering but was ignored due to a change in the player state (current state: '${playerState.status}'). Error Details:`,
+              err
+            );
+            return false;
+          }
+          const currentError = trackedErrors.current.get(err);
+          if (currentError !== void 0) {
+            return currentError;
+          }
+          let isRecovering = false;
+          setErrorSubId((prev) => {
+            const subId = prev === void 0 ? subscribe(clearErrorTracking, {
+              initializeWithPreviousValue: false
+            }) : prev;
+            isRecovering = playerState.controllers.error.captureError(err);
+            trackedErrors.current.set(err, isRecovering);
+            if (!isRecovering) {
+              if (subId !== prev) {
+                unsubscribe(subId);
+              }
+              return prev;
+            }
+            return subId;
+          });
+          return isRecovering;
+        },
+        [errorSubId]
+      );
       return /* @__PURE__ */ React4.createElement(
         ErrorBoundary2,
         {
-          fallbackRender: () => null,
-          onError: (err) => {
-            const playerState = this.player.getState();
-            if (playerState.status === "in-progress") {
-              playerState.fail(err);
+          fallbackRender: (fallbackProps) => {
+            const isRecovering = captureError(fallbackProps.error);
+            if (!isRecovering) {
+              return null;
             }
+            fallbackProps.resetErrorBoundary();
+            return /* @__PURE__ */ React4.createElement(
+              ReactPlayerPropsContext.Provider,
+              {
+                value: { ...componentProps, isInErrorState: true }
+              },
+              /* @__PURE__ */ React4.createElement(PlayerContext.Provider, { value: { player: this.player } }, /* @__PURE__ */ React4.createElement(BaseComp, { ...componentProps, isInErrorState: true }))
+            );
           }
         },
-        /* @__PURE__ */ React4.createElement(PlayerContext.Provider, { value: { player: this.player } }, /* @__PURE__ */ React4.createElement(BaseComp, { ...props }))
+        /* @__PURE__ */ React4.createElement(ReactPlayerPropsContext.Provider, { value: { ...componentProps } }, /* @__PURE__ */ React4.createElement(PlayerContext.Provider, { value: { player: this.player } }, /* @__PURE__ */ React4.createElement(BaseComp, { ...componentProps })))
       );
     };
     return ReactPlayerComponent;
@@ -342,8 +429,16 @@ var ReactPlayer2 = class {
   createReactComp() {
     const ActualPlayerComp = this.hooks.playerComponent.call(ReactPlayer);
     const WebPlayerComponent = () => {
+      const { isInErrorState } = React4.useContext(ReactPlayerPropsContext);
       const view = useSubscribedState(this.viewUpdateSubscription);
+      const lastSuccessfulView = React4.useRef(void 0);
       this.viewUpdateSubscription.suspend();
+      React4.useEffect(() => {
+        if (!isInErrorState) {
+          lastSuccessfulView.current = view;
+        }
+      }, [isInErrorState, view]);
+      const displayedView = isInErrorState ? lastSuccessfulView.current : view;
       return /* @__PURE__ */ React4.createElement(
         AssetContext.Provider,
         {
@@ -351,7 +446,7 @@ var ReactPlayer2 = class {
             registry: this.assetRegistry
           }
         },
-        view && /* @__PURE__ */ React4.createElement(ActualPlayerComp, { view })
+        displayedView && /* @__PURE__ */ React4.createElement(ActualPlayerComp, { view: displayedView })
       );
     };
     return WebPlayerComponent;
@@ -626,9 +721,7 @@ var usePersistentStateMachine = (options) => {
     if (oldManagedState) {
       const playerState = oldManagedState.state?.context.reactPlayer.player.getState();
       if (oldManagedState.state?.value === "running" && playerState?.status === "in-progress") {
-        previousManager.current.terminate?.(
-          playerState.controllers.data.serialize()
-        );
+        previousManager.current.terminate?.(playerState);
       }
     }
     const newKey = createKey();
@@ -685,7 +778,7 @@ var ManagedPlayer = (props) => {
     } else if (state?.value === "error") {
       props.onError?.(state?.context.error);
     } else if (state?.value === "running") {
-      props.onStartedFlow?.();
+      props.onStartedFlow?.(state.context.flow);
     }
   }
   previousState.current = state;
@@ -693,7 +786,7 @@ var ManagedPlayer = (props) => {
     return () => {
       const playerState = state?.context.reactPlayer.player.getState();
       if (state?.value === "running" && playerState?.status === "in-progress") {
-        props.manager.terminate?.(playerState.controllers.data.serialize());
+        props.manager.terminate?.(playerState);
       }
     };
   }, [props.manager, state?.context.reactPlayer.player, state?.value]);
@@ -729,6 +822,7 @@ export {
   PlayerContext,
   ReactAsset,
   ReactPlayer2 as ReactPlayer,
+  ReactPlayerPropsContext,
   WebPlayer,
   buildUrl,
   callOrReturn,