stagebook 0.3.0 → 0.3.1

package/dist/components/index.cjs

@@ -1227,17 +1227,20 @@ function YouTubeControls({
 
 
 
-
 var PlaybackContext = _react.createContext.call(void 0, null);
 function PlaybackProvider({ children }) {
   const [handles, setHandles] = _react.useState.call(void 0, 
     () => /* @__PURE__ */ new Map()
   );
   const register = _react.useCallback.call(void 0, (name, handle) => {
-    setHandles((prev) => new Map(prev).set(name, handle));
+    setHandles((prev) => {
+      if (prev.get(name) === handle) return prev;
+      return new Map(prev).set(name, handle);
+    });
   }, []);
   const unregister = _react.useCallback.call(void 0, (name) => {
     setHandles((prev) => {
+      if (!prev.has(name)) return prev;
       const next = new Map(prev);
       next.delete(name);
       return next;
@@ -1251,17 +1254,17 @@ function PlaybackProvider({ children }) {
 }
 function useRegisterPlayback(name, handle) {
   const ctx = _react.useContext.call(void 0, PlaybackContext);
-  const handleRef = _react.useRef.call(void 0, handle);
-  handleRef.current = handle;
+  const register = _optionalChain([ctx, 'optionalAccess', _25 => _25.register]);
+  const unregister = _optionalChain([ctx, 'optionalAccess', _26 => _26.unregister]);
   _react.useEffect.call(void 0, () => {
-    if (!ctx) return;
-    ctx.register(name, handle);
-    return () => ctx.unregister(name);
-  }, [name, ctx, handle]);
+    if (!register || !unregister) return;
+    register(name, handle);
+    return () => unregister(name);
+  }, [name, handle, register, unregister]);
 }
 function usePlayback(source) {
   const ctx = _react.useContext.call(void 0, PlaybackContext);
-  return _optionalChain([ctx, 'optionalAccess', _25 => _25.handles, 'access', _26 => _26.get, 'call', _27 => _27(source)]);
+  return _optionalChain([ctx, 'optionalAccess', _27 => _27.handles, 'access', _28 => _28.get, 'call', _29 => _29(source)]);
 }
 
 // src/components/elements/mediaPlayer/waveformCapture.ts
@@ -1433,7 +1436,7 @@ function MediaPlayer({
       return;
     const buckets = computeBucketCount(duration, BUCKETS_PER_SECOND2);
     if (buckets === 0) return;
-    if (peaksRef.current.length === channelCount && _optionalChain([peaksRef, 'access', _28 => _28.current, 'access', _29 => _29[0], 'optionalAccess', _30 => _30.length]) === buckets * 2)
+    if (peaksRef.current.length === channelCount && _optionalChain([peaksRef, 'access', _30 => _30.current, 'access', _31 => _31[0], 'optionalAccess', _32 => _32.length]) === buckets * 2)
       return;
     peaksRef.current = createPeaksArrays(channelCount, buckets);
   }, [channelCount, duration]);
@@ -1492,15 +1495,15 @@ function MediaPlayer({
   const handle = _react.useMemo.call(void 0, 
     () => ({
       play: () => {
-        void _optionalChain([videoRef, 'access', _31 => _31.current, 'optionalAccess', _32 => _32.play, 'call', _33 => _33()]);
+        void _optionalChain([videoRef, 'access', _33 => _33.current, 'optionalAccess', _34 => _34.play, 'call', _35 => _35()]);
       },
-      pause: () => _optionalChain([videoRef, 'access', _34 => _34.current, 'optionalAccess', _35 => _35.pause, 'call', _36 => _36()]),
+      pause: () => _optionalChain([videoRef, 'access', _36 => _36.current, 'optionalAccess', _37 => _37.pause, 'call', _38 => _38()]),
       seekTo: (s) => {
         if (videoRef.current) videoRef.current.currentTime = s;
       },
-      getCurrentTime: () => _nullishCoalesce(_optionalChain([videoRef, 'access', _37 => _37.current, 'optionalAccess', _38 => _38.currentTime]), () => ( 0)),
-      getDuration: () => _nullishCoalesce(_optionalChain([videoRef, 'access', _39 => _39.current, 'optionalAccess', _40 => _40.duration]), () => ( 0)),
-      isPaused: () => _nullishCoalesce(_optionalChain([videoRef, 'access', _41 => _41.current, 'optionalAccess', _42 => _42.paused]), () => ( true)),
+      getCurrentTime: () => _nullishCoalesce(_optionalChain([videoRef, 'access', _39 => _39.current, 'optionalAccess', _40 => _40.currentTime]), () => ( 0)),
+      getDuration: () => _nullishCoalesce(_optionalChain([videoRef, 'access', _41 => _41.current, 'optionalAccess', _42 => _42.duration]), () => ( 0)),
+      isPaused: () => _nullishCoalesce(_optionalChain([videoRef, 'access', _43 => _43.current, 'optionalAccess', _44 => _44.paused]), () => ( true)),
       isYouTube: false,
       get channelCount() {
         return channelCount;
@@ -1605,7 +1608,7 @@ function MediaPlayer({
       setIsPaused(true);
       recordEvent("ended", e.currentTarget.currentTime);
       if (submitOnComplete) {
-        _optionalChain([onComplete, 'optionalCall', _43 => _43()]);
+        _optionalChain([onComplete, 'optionalCall', _45 => _45()]);
       }
     },
     [recordEvent, submitOnComplete, onComplete]
@@ -1637,7 +1640,7 @@ function MediaPlayer({
       };
       const friendly = err ? _nullishCoalesce(codeMessages[err.code], () => ( `Error code ${String(err.code)}`)) : "Unknown error";
       console.error(
-        `[MediaPlayer] Video error (code ${_optionalChain([err, 'optionalAccess', _44 => _44.code])}): ${_nullishCoalesce(_optionalChain([err, 'optionalAccess', _45 => _45.message]), () => ( "unknown"))}`
+        `[MediaPlayer] Video error (code ${_optionalChain([err, 'optionalAccess', _46 => _46.code])}): ${_nullishCoalesce(_optionalChain([err, 'optionalAccess', _47 => _47.message]), () => ( "unknown"))}`
       );
       setLoadError(friendly);
     },
@@ -1660,12 +1663,12 @@ function MediaPlayer({
         stopAtReachedRef.current = true;
         e.currentTarget.pause();
         recordEvent("stopAt", ct);
-        if (submitOnComplete) _optionalChain([onComplete, 'optionalCall', _46 => _46()]);
+        if (submitOnComplete) _optionalChain([onComplete, 'optionalCall', _48 => _48()]);
         return;
       }
       if (cues.length > 0) {
         const active = cues.find((c) => ct >= c.startTime && ct <= c.endTime);
-        setCaptionText(_nullishCoalesce(_optionalChain([active, 'optionalAccess', _47 => _47.text]), () => ( null)));
+        setCaptionText(_nullishCoalesce(_optionalChain([active, 'optionalAccess', _49 => _49.text]), () => ( null)));
       }
     },
     [stopAt, cues, recordEvent, submitOnComplete, onComplete]
@@ -1915,8 +1918,8 @@ function MediaPlayer({
     }
   }, []);
   const ytOnPlayPause = _react.useCallback.call(void 0, () => {
-    if (isPaused) _optionalChain([ytHandle, 'optionalAccess', _48 => _48.play, 'call', _49 => _49()]);
-    else _optionalChain([ytHandle, 'optionalAccess', _50 => _50.pause, 'call', _51 => _51()]);
+    if (isPaused) _optionalChain([ytHandle, 'optionalAccess', _50 => _50.play, 'call', _51 => _51()]);
+    else _optionalChain([ytHandle, 'optionalAccess', _52 => _52.pause, 'call', _53 => _53()]);
   }, [isPaused, ytHandle]);
   const ytOnSeekBack = _react.useCallback.call(void 0, () => {
     seek(-1);
@@ -1930,25 +1933,25 @@ function MediaPlayer({
         scrubWasPlayingRef.current = true;
         ytHandle.pause();
       }
-      _optionalChain([ytHandle, 'optionalAccess', _52 => _52.seekTo, 'call', _53 => _53(t)]);
+      _optionalChain([ytHandle, 'optionalAccess', _54 => _54.seekTo, 'call', _55 => _55(t)]);
       setCurrentTime(t);
     },
     [ytHandle]
   );
   const ytOnScrubMove = _react.useCallback.call(void 0, 
     (t) => {
-      _optionalChain([ytHandle, 'optionalAccess', _54 => _54.seekTo, 'call', _55 => _55(t)]);
+      _optionalChain([ytHandle, 'optionalAccess', _56 => _56.seekTo, 'call', _57 => _57(t)]);
       setCurrentTime(t);
     },
     [ytHandle]
   );
   const ytOnScrubEnd = _react.useCallback.call(void 0, 
     (t) => {
-      _optionalChain([ytHandle, 'optionalAccess', _56 => _56.seekTo, 'call', _57 => _57(t)]);
+      _optionalChain([ytHandle, 'optionalAccess', _58 => _58.seekTo, 'call', _59 => _59(t)]);
       setCurrentTime(t);
       if (scrubWasPlayingRef.current) {
         scrubWasPlayingRef.current = false;
-        _optionalChain([ytHandle, 'optionalAccess', _58 => _58.play, 'call', _59 => _59()]);
+        _optionalChain([ytHandle, 'optionalAccess', _60 => _60.play, 'call', _61 => _61()]);
       }
     },
     [ytHandle]
@@ -2024,7 +2027,7 @@ function MediaPlayer({
                     if (stopAtReachedRef.current) {
                       stopAtReachedRef.current = false;
                       recordEvent("stopAt", t);
-                      if (submitOnComplete) _optionalChain([onComplete, 'optionalCall', _60 => _60()]);
+                      if (submitOnComplete) _optionalChain([onComplete, 'optionalCall', _62 => _62()]);
                       return;
                     }
                     recordEvent("pause", t);
@@ -2033,7 +2036,7 @@ function MediaPlayer({
                     setIsPaused(true);
                     setCurrentTime(t);
                     recordEvent("ended", t);
-                    if (submitOnComplete) _optionalChain([onComplete, 'optionalCall', _61 => _61()]);
+                    if (submitOnComplete) _optionalChain([onComplete, 'optionalCall', _63 => _63()]);
                   }
                 }
               ),
@@ -2976,7 +2979,7 @@ function SelectionOverlay({
   const handlePointerCancel = _react.useCallback.call(void 0, 
     (e) => {
       releasePointer(e);
-      if (_optionalChain([dragRef, 'access', _62 => _62.current, 'optionalAccess', _63 => _63.beganDrag])) onEndDrag();
+      if (_optionalChain([dragRef, 'access', _64 => _64.current, 'optionalAccess', _65 => _65.beganDrag])) onEndDrag();
       dragRef.current = null;
       setDragPreview(null);
     },
@@ -3440,7 +3443,7 @@ function Minimap({
     [eventToTime, duration, zoomLevel, onViewportChange]
   );
   const handlePointerUp = _react.useCallback.call(void 0, (e) => {
-    if (_optionalChain([dragRef, 'access', _64 => _64.current, 'optionalAccess', _65 => _65.pointerId]) === e.pointerId) {
+    if (_optionalChain([dragRef, 'access', _66 => _66.current, 'optionalAccess', _67 => _67.pointerId]) === e.pointerId) {
       dragRef.current = null;
       try {
         e.currentTarget.releasePointerCapture(e.pointerId);
@@ -3933,7 +3936,7 @@ function Timeline({
   const containerElRef = _react.useRef.call(void 0, null);
   const containerRef = _react.useCallback.call(void 0, (el) => {
     containerElRef.current = el;
-    _optionalChain([observerRef, 'access', _66 => _66.current, 'optionalAccess', _67 => _67.disconnect, 'call', _68 => _68()]);
+    _optionalChain([observerRef, 'access', _68 => _68.current, 'optionalAccess', _69 => _69.disconnect, 'call', _70 => _70()]);
     observerRef.current = null;
     if (!el) return;
     setContainerWidth(el.getBoundingClientRect().width);
@@ -3948,7 +3951,7 @@ function Timeline({
   }, []);
   _react.useEffect.call(void 0, () => {
     return () => {
-      _optionalChain([observerRef, 'access', _69 => _69.current, 'optionalAccess', _70 => _70.disconnect, 'call', _71 => _71()]);
+      _optionalChain([observerRef, 'access', _71 => _71.current, 'optionalAccess', _72 => _72.disconnect, 'call', _73 => _73()]);
       observerRef.current = null;
     };
   }, []);
@@ -4043,7 +4046,7 @@ function Timeline({
   }, []);
   _react.useEffect.call(void 0, () => {
     if (zoomLevel <= 1) return;
-    const duration2 = _nullishCoalesce(_optionalChain([handleRef, 'access', _72 => _72.current, 'optionalAccess', _73 => _73.getDuration, 'call', _74 => _74()]), () => ( 0));
+    const duration2 = _nullishCoalesce(_optionalChain([handleRef, 'access', _74 => _74.current, 'optionalAccess', _75 => _75.getDuration, 'call', _76 => _76()]), () => ( 0));
     if (duration2 <= 0) return;
     const visibleDuration2 = duration2 / zoomLevel;
     const lastT = lastPlayheadRef.current;
@@ -4076,7 +4079,7 @@ function Timeline({
     }
   }, [currentTime, isPaused, zoomLevel, viewportStart]);
   const onZoomIn = _react.useCallback.call(void 0, () => {
-    const duration2 = _nullishCoalesce(_optionalChain([handleRef, 'access', _75 => _75.current, 'optionalAccess', _76 => _76.getDuration, 'call', _77 => _77()]), () => ( 0));
+    const duration2 = _nullishCoalesce(_optionalChain([handleRef, 'access', _77 => _77.current, 'optionalAccess', _78 => _78.getDuration, 'call', _79 => _79()]), () => ( 0));
     if (duration2 <= 0) return;
     const newZoom = zoomIn(zoomLevel);
     if (newZoom === zoomLevel) return;
@@ -4092,7 +4095,7 @@ function Timeline({
     );
   }, [zoomLevel, viewportStart, currentTime]);
   const onZoomOut = _react.useCallback.call(void 0, () => {
-    const duration2 = _nullishCoalesce(_optionalChain([handleRef, 'access', _78 => _78.current, 'optionalAccess', _79 => _79.getDuration, 'call', _80 => _80()]), () => ( 0));
+    const duration2 = _nullishCoalesce(_optionalChain([handleRef, 'access', _80 => _80.current, 'optionalAccess', _81 => _81.getDuration, 'call', _82 => _82()]), () => ( 0));
     if (duration2 <= 0) return;
     const newZoom = zoomOut(zoomLevel);
     if (newZoom === zoomLevel) return;
@@ -4109,7 +4112,7 @@ function Timeline({
   }, [zoomLevel, viewportStart, currentTime]);
   const onMinimapPan = _react.useCallback.call(void 0, 
     (newStart) => {
-      const duration2 = _nullishCoalesce(_optionalChain([handleRef, 'access', _81 => _81.current, 'optionalAccess', _82 => _82.getDuration, 'call', _83 => _83()]), () => ( 0));
+      const duration2 = _nullishCoalesce(_optionalChain([handleRef, 'access', _83 => _83.current, 'optionalAccess', _84 => _84.getDuration, 'call', _85 => _85()]), () => ( 0));
       setViewportStart(clampViewportStart(newStart, duration2, zoomLevel));
     },
     [zoomLevel]
@@ -4135,7 +4138,7 @@ function Timeline({
     if (!action) return;
     e.preventDefault();
     e.stopPropagation();
-    const dur = _nullishCoalesce(_optionalChain([handleRef, 'access', _84 => _84.current, 'optionalAccess', _85 => _85.getDuration, 'call', _86 => _86()]), () => ( 0));
+    const dur = _nullishCoalesce(_optionalChain([handleRef, 'access', _86 => _86.current, 'optionalAccess', _87 => _87.getDuration, 'call', _88 => _88()]), () => ( 0));
     const clampToMedia = (t) => {
       if (Number.isFinite(dur) && dur > 0) {
         return Math.max(0, Math.min(t, dur));
@@ -4152,7 +4155,7 @@ function Timeline({
           handle: action.handle,
           time: t
         });
-        _optionalChain([handleRef, 'access', _87 => _87.current, 'optionalAccess', _88 => _88.seekTo, 'call', _89 => _89(t)]);
+        _optionalChain([handleRef, 'access', _89 => _89.current, 'optionalAccess', _90 => _90.seekTo, 'call', _91 => _91(t)]);
         break;
       }
       case "repositionPoint": {
@@ -4163,7 +4166,7 @@ function Timeline({
           index: action.index,
           time: t
         });
-        _optionalChain([handleRef, 'access', _90 => _90.current, 'optionalAccess', _91 => _91.seekTo, 'call', _92 => _92(t)]);
+        _optionalChain([handleRef, 'access', _92 => _92.current, 'optionalAccess', _93 => _93.seekTo, 'call', _94 => _94(t)]);
         break;
       }
       case "switchHandle":
@@ -4210,7 +4213,7 @@ function Timeline({
   );
   const labels = [];
   for (let i = 0; i < channelCount; i++) {
-    labels.push(_nullishCoalesce(_optionalChain([trackLabels, 'optionalAccess', _93 => _93[i]]), () => ( `Position ${String(i)}`)));
+    labels.push(_nullishCoalesce(_optionalChain([trackLabels, 'optionalAccess', _95 => _95[i]]), () => ( `Position ${String(i)}`)));
   }
   const tracksHeight = channelCount * TRACK_HEIGHT;
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
@@ -4333,7 +4336,7 @@ function Timeline({
                       setIsDragging(true);
                     },
                     onEndDrag: () => setIsDragging(false),
-                    onRequestFocus: () => _optionalChain([containerElRef, 'access', _94 => _94.current, 'optionalAccess', _95 => _95.focus, 'call', _96 => _96({ preventScroll: true })])
+                    onRequestFocus: () => _optionalChain([containerElRef, 'access', _96 => _96.current, 'optionalAccess', _97 => _97.focus, 'call', _98 => _98({ preventScroll: true })])
                   }
                 ),
                 /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -4457,7 +4460,7 @@ var blockquoteStyle2 = {
 function Markdown({ text, resolveURL }) {
   let displayText = text;
   if (resolveURL) {
-    displayText = _optionalChain([text, 'optionalAccess', _97 => _97.replace, 'call', _98 => _98(
+    displayText = _optionalChain([text, 'optionalAccess', _99 => _99.replace, 'call', _100 => _100(
       /!\[(.*?)\]\((.*?)\)/g,
       (_match, alt, path) => {
         if (path.startsWith("http://") || path.startsWith("https://")) {
@@ -4850,7 +4853,7 @@ function Slider({
   const handleChange = (e) => {
     const newValue = parseFloat(e.target.value);
     setLocalValue(newValue);
-    _optionalChain([onChange, 'optionalCall', _99 => _99(newValue)]);
+    _optionalChain([onChange, 'optionalCall', _101 => _101(newValue)]);
   };
   const handleClick = (e) => {
     if (localValue !== void 0 && localValue !== null) return;
@@ -4861,7 +4864,7 @@ function Slider({
     const newValue = Math.round(rawValue / interval) * interval;
     const clampedValue = Math.max(min, Math.min(max, newValue));
     setLocalValue(clampedValue);
-    _optionalChain([onChange, 'optionalCall', _100 => _100(clampedValue)]);
+    _optionalChain([onChange, 'optionalCall', _102 => _102(clampedValue)]);
   };
   const getPosition = (pt) => (pt - min) / (max - min) * 100;
   const hasValue = localValue !== void 0 && localValue !== null;
@@ -5267,7 +5270,7 @@ function Prompt({
         maxLength
       }
     ),
-    promptType === "openResponse" && shared && _optionalChain([renderSharedNotepad, 'optionalCall', _101 => _101({
+    promptType === "openResponse" && shared && _optionalChain([renderSharedNotepad, 'optionalCall', _103 => _103({
       padName: name,
       defaultText: responses.join("\n"),
       rows
@@ -5541,7 +5544,7 @@ function Element({ element, onSubmit, stageDuration }) {
               element.file ? ` "${element.file}"` : "",
               ":",
               " ",
-              _optionalChain([parsed, 'access', _102 => _102.error, 'access', _103 => _103.issues, 'access', _104 => _104[0], 'optionalAccess', _105 => _105.message])
+              _optionalChain([parsed, 'access', _104 => _104.error, 'access', _105 => _105.issues, 'access', _106 => _106[0], 'optionalAccess', _107 => _107.message])
             ]
           }
         );
@@ -5652,9 +5655,9 @@ function Element({ element, onSubmit, stageDuration }) {
         }
       );
     case "talkMeter":
-      return _nullishCoalesce(_optionalChain([renderTalkMeter, 'optionalCall', _106 => _106()]), () => ( null));
+      return _nullishCoalesce(_optionalChain([renderTalkMeter, 'optionalCall', _108 => _108()]), () => ( null));
     case "sharedNotepad":
-      return _nullishCoalesce(_optionalChain([renderSharedNotepad, 'optionalCall', _107 => _107({
+      return _nullishCoalesce(_optionalChain([renderSharedNotepad, 'optionalCall', _109 => _109({
         padName: _nullishCoalesce(element.name, () => ( ""))
       })]), () => ( null));
     case "qualtrics": {
@@ -5673,7 +5676,7 @@ function Element({ element, onSubmit, stageDuration }) {
     case "survey": {
       const surveyName = _nullishCoalesce(element.surveyName, () => ( ""));
       const surveyKey = _nullishCoalesce(element.name, () => ( surveyName));
-      return _nullishCoalesce(_optionalChain([renderSurvey, 'optionalCall', _108 => _108({
+      return _nullishCoalesce(_optionalChain([renderSurvey, 'optionalCall', _110 => _110({
         surveyName,
         onComplete: (results) => {
           wrappedSave(`survey_${surveyKey}`, results);
@@ -5682,7 +5685,7 @@ function Element({ element, onSubmit, stageDuration }) {
       })]), () => ( null));
     }
     case "discussion":
-      return _nullishCoalesce(_optionalChain([renderDiscussion, 'optionalCall', _109 => _109(element)]), () => ( null));
+      return _nullishCoalesce(_optionalChain([renderDiscussion, 'optionalCall', _111 => _111(element)]), () => ( null));
     default:
       console.warn(`Unknown element type: ${element.type}`);
       return null;