@weasel-js/forge 1.8.1 → 1.9.1

package/dist/shell/index.js

@@ -1,10 +1,10 @@
 import { parseRoute, paramsToKnobs, knobPaths, sameKnob, knobsToParams, formatRoute, PLAYHEAD_PARAM, reservedParams } from '../chunk-CJX3W5HY.js';
-import { isIndexId, indexId, libraryOf, indexEntries, schemaFromDescription, LibraryBadge, openChannel, IndexPage } from '../chunk-JQD3MVUQ.js';
+import { isIndexId, indexId, libraryOf, indexEntries, schemaFromDescription, LibraryBadge, openChannel, IndexPage } from '../chunk-JVRHBI3V.js';
 import { isGallery } from '../chunk-WEQSLPKT.js';
-import { useTrialFrame, createTrialFrames, createTrialClocks, StoryGlobalsContext, TrialFramesContext, TrialClocksContext, StoryTrial, useCssOverrides, useTrialClock, TrialHost } from '../chunk-GHTVXHNJ.js';
-export { StoryGlobalsContext, StoryTrial, TrialFramesContext, TrialHost, useTrialFrame } from '../chunk-GHTVXHNJ.js';
+import { useTrialFrame, createTrialFrames, createTrialClocks, StoryGlobalsContext, TrialFramesContext, TrialClocksContext, StoryTrial, useCssOverrides, useNearViewport, IN_VIEW_MARGIN, useTrialClock, TrialHost } from '../chunk-QN3HJQXZ.js';
+export { StoryGlobalsContext, StoryTrial, TrialFramesContext, TrialHost, useTrialFrame } from '../chunk-QN3HJQXZ.js';
 import { labGlobals, withGlobals, followApp, storyConfig, GLOBALS_KEY, effectiveGlobals, PLAYHEAD_KEY, labOptions, isGlobalsPath } from '../chunk-NI5FYQHW.js';
-import { loadStories, indexRenderOf } from '../chunk-5N4YP5HS.js';
+import { loadStories, indexRenderOf } from '../chunk-Q2EZXJFE.js';
 import '../chunk-L5XM5VKB.js';
 import '../chunk-HRGPFQBW.js';
 import '../chunk-MGQWCPYE.js';
@@ -1446,24 +1446,6 @@ var readyKey = (ready) => stableStringify({ schema: ready.schema, layout: ready.
 var START_TIMEOUT_MS = 1e4;
 var HELLO_TIMEOUT_MS = 3e4;
 var requests = 0;
-var IN_VIEW_MARGIN = "50%";
-function useInView(ref) {
-  const [inView, setInView] = useState(true);
-  useEffect(() => {
-    const el = ref.current;
-    if (!el || typeof IntersectionObserver === "undefined") return;
-    const observer = new IntersectionObserver(
-      (entries) => {
-        const last = entries.at(-1);
-        if (last) setInView(last.isIntersecting);
-      },
-      { rootMargin: IN_VIEW_MARGIN }
-    );
-    observer.observe(el);
-    return () => observer.disconnect();
-  }, [ref]);
-  return inView;
-}
 function closeLink(link) {
   if (!link.current) return;
   clearTimeout(link.current.timer);
@@ -1495,7 +1477,7 @@ function FrameView(props) {
   const iframeRef = useRef(null);
   const hostRef = useRef(null);
   const slotRef = useRef(null);
-  const inView = useInView(hostRef);
+  const inView = useNearViewport(hostRef, IN_VIEW_MARGIN);
   const link = useRef(null);
   const latest = useLatest({ ...props, globals, overrides, pool, lab, title });
   const [fault, setFault] = useState(null);
@@ -1726,6 +1708,7 @@ function storyInstrument(options) {
     globals
   );
   const descriptionKey = ready ? readyKey(ready) : null;
+  const viewport = ready ? ready.viewport : entry.viewport;
   return {
     name: entry.id,
     title: breadcrumb(entry.title, entry.name),
@@ -1743,7 +1726,8 @@ function storyInstrument(options) {
         ctx
       }
     ),
-    ...ready?.viewport ? { stage: { size: { width: ready.viewport.width, height: ready.viewport.height } } } : {}
+    // Taken from the index until the frame reports, so the trial does not move the frame into a stage and reload it.
+    ...viewport ? { stage: { size: { width: viewport.width, height: viewport.height } } } : {}
   };
 }
 
@@ -1766,13 +1750,16 @@ function useStoryRegistry(index, options) {
       return new Map(prev).set(entry.id, ready);
     });
   }, []);
-  useEffect(() => {
+  const indexIds = JSON.stringify(index.map((entry) => entry.id));
+  const [prunedFor, setPrunedFor] = useState(indexIds);
+  if (prunedFor !== indexIds) {
+    setPrunedFor(indexIds);
     const ids = new Set(index.map((entry) => entry.id));
     setReadies((prev) => pruned(prev, ids));
     setLoaded((prev) => pruned(prev, ids));
     setFaults((prev) => pruned(prev, ids));
     setRevisions((prev) => pruned(prev, ids));
-  }, [index]);
+  }
   const imports = useRef(/* @__PURE__ */ new Map());
   const live = useLatest({ index, importers, setup, load });
   const importOf = useCallback((file) => {