forgebook 0.1.8 → 0.2.0

package/dist/src/frame/shellChannel.js

@@ -0,0 +1,39 @@
+/**
+ * A frame's side of the messages with the shell: it tells only the catalogue's origin, and hears only its parent page
+ * on that origin.
+ *
+ * @remarks
+ * The frame works out the catalogue's origin from the placement and its own address, never from its address's query:
+ * a page that framed a story could otherwise name itself the catalogue and send the story values (a prop's `href`) no
+ * panel would set. A frame opened alone, with no parent, tells nobody.
+ *
+ * @module
+ */
+import { pageOrigins } from "../frameOrigins.js";
+import { isShellMessage } from "../messages.js";
+/**
+ * The frame's channel with its shell.
+ *
+ * @param placement - where the frames run.
+ * @param frame - the frame's window.
+ */
+export const shellChannel = (placement, frame) => {
+    const { catalogue } = pageOrigins(placement, frame.location, "frame");
+    // a frame opened alone is its own parent
+    const parent = frame.parent;
+    const hasParent = parent !== frame;
+    return {
+        tell: (message) => {
+            if (hasParent)
+                frame.parent.postMessage(message, catalogue);
+        },
+        listen: (onMessage) => {
+            frame.addEventListener("message", (event) => {
+                if (!hasParent || event.source !== frame.parent || event.origin !== catalogue)
+                    return;
+                if (isShellMessage(event.data))
+                    onMessage(event.data);
+            });
+        }
+    };
+};

package/dist/src/frame/spillOutline.d.ts

@@ -7,4 +7,3 @@
  * @returns the switch.
  */
 export declare const spillOutline: (document: Document, rootSelector: string, onCount: (count: number) => void) => ((isOn: boolean) => void);
-//# sourceMappingURL=spillOutline.d.ts.map

package/dist/src/frame/spillOutline.js

@@ -79,4 +79,3 @@ export const spillOutline = (document, rootSelector, onCount) => {
         }
     };
 };
-//# sourceMappingURL=spillOutline.js.map

package/dist/src/frame/staleModule.d.ts

@@ -10,6 +10,18 @@
  *
  * @module
  */
+/**
+ * Where the frame's load guard counts the reloads of a frame whose code could not be loaded, before the frame's page and
+ * story (`loadReloadsKey`).
+ */
+export declare const LOAD_RELOADS_KEY = "forgebook:load-reloads:";
+/**
+ * The key of a frame's count of reloads: its page and its story, not its whole address, which the view's query changes
+ * while the frame loads. The page's guard writes the same key.
+ *
+ * @param address - the frame's address.
+ */
+export declare const loadReloadsKey: (address: string) => string;
 /**
  * Whether an error message is a dynamic import that failed to load.
  *
@@ -25,7 +37,8 @@ export declare const isStaleModuleError: (message: string) => boolean;
  */
 export declare const markRetry: (storage: Storage | undefined, address: string) => boolean;
 /**
- * Forgets an address's retry once its story rendered, so a later stale module gets its retry too.
+ * Forgets an address's retry once its story rendered, so a later stale module gets its retry too, and the load guard's
+ * count of reloads.
  *
  * @param storage - the session storage, or `undefined` where it is unavailable.
  * @param address - the frame's address.
@@ -37,4 +50,3 @@ export declare const clearRetry: (storage: Storage | undefined, address: string)
  * @param target - the frame's window.
  */
 export declare const sessionStorageOf: (target: Window) => Storage | undefined;
-//# sourceMappingURL=staleModule.d.ts.map

package/dist/src/frame/staleModule.js

@@ -18,6 +18,22 @@ const STALE_MODULE_MESSAGES = [
 ];
 /** The key of a frame address's retry mark. */
 const markKey = (address) => `forgebook:reloaded:${address}`;
+/**
+ * Where the frame's load guard counts the reloads of a frame whose code could not be loaded, before the frame's page and
+ * story (`loadReloadsKey`).
+ */
+export const LOAD_RELOADS_KEY = "forgebook:load-reloads:";
+/**
+ * The key of a frame's count of reloads: its page and its story, not its whole address, which the view's query changes
+ * while the frame loads. The page's guard writes the same key.
+ *
+ * @param address - the frame's address.
+ */
+export const loadReloadsKey = (address) => {
+    // a base for an address given without its origin: only the path and the story are read
+    const url = new URL(address, "http://frame.invalid");
+    return `${LOAD_RELOADS_KEY}${url.pathname}?story=${url.searchParams.get("story") ?? ""}`;
+};
 /**
  * Whether an error message is a dynamic import that failed to load.
  *
@@ -45,7 +61,8 @@ export const markRetry = (storage, address) => {
     }
 };
 /**
- * Forgets an address's retry once its story rendered, so a later stale module gets its retry too.
+ * Forgets an address's retry once its story rendered, so a later stale module gets its retry too, and the load guard's
+ * count of reloads.
  *
  * @param storage - the session storage, or `undefined` where it is unavailable.
  * @param address - the frame's address.
@@ -53,6 +70,7 @@ export const markRetry = (storage, address) => {
 export const clearRetry = (storage, address) => {
     try {
         storage?.removeItem(markKey(address));
+        storage?.removeItem(loadReloadsKey(address));
     }
     catch {
         // nothing to forget where the storage refuses access
@@ -71,4 +89,3 @@ export const sessionStorageOf = (target) => {
         return undefined;
     }
 };
-//# sourceMappingURL=staleModule.js.map

package/dist/src/frame/storyCanvas.d.ts

@@ -18,4 +18,3 @@ export declare const storyCanvas: (document: Document, story: LoadedStory) => HT
  * @param story - the story.
  */
 export declare const forceStates: (element: HTMLElement, story: LoadedStory) => void;
-//# sourceMappingURL=storyCanvas.d.ts.map

package/dist/src/frame/storyCanvas.js

@@ -27,4 +27,3 @@ export const forceStates = (element, story) => {
     if (story.forceState.length > 0)
         element.setAttribute(FORCE_ATTRIBUTE, story.forceState.join(" "));
 };
-//# sourceMappingURL=storyCanvas.js.map

package/dist/src/frame/storyHooks.d.ts

@@ -28,4 +28,3 @@ export type PreparedStory = {
  * @throws What a loader or a set-up throws, after undoing the set-ups that ran.
  */
 export declare const prepareStory: (story: Pick<LoadedStory, "loaders" | "beforeEach">, context: Omit<StoryHookContext<LoadedArgs>, "loaded">) => Promise<PreparedStory>;
-//# sourceMappingURL=storyHooks.d.ts.map

package/dist/src/frame/storyHooks.js

@@ -56,4 +56,3 @@ export const prepareStory = async (story, context) => {
     }
     return { loaded, cleanup: () => runCleanups(cleanups) };
 };
-//# sourceMappingURL=storyHooks.js.map

package/dist/src/frame/storyModule.d.ts

@@ -83,13 +83,17 @@ export type LoadedPreview = {
     readonly argTypes: Readonly<Record<string, unknown>>;
     /** Its parameters, under every meta's. */
     readonly parameters: Readonly<Record<string, unknown>>;
+    /** The globals it starts from, under the switches': what its decorators read. */
+    readonly globals: Readonly<Record<string, string>>;
     /** What runs once before any story renders; nothing when it has none. */
     readonly setup: (() => Promise<void>) | undefined;
 };
 /** The preview of a catalogue that has none. */
 export declare const NO_PREVIEW: LoadedPreview;
 /**
- * A catalogue's preview read safely, as a story file is: from the default export of its module, or the module itself.
+ * A catalogue's preview read safely, as a story file is: field by field, as Storybook reads one, the default export's
+ * value or else the module's named export. A preview often writes both (`export const decorators` beside
+ * `export default preview`), and reading only one of them would drop the other's providers without a word.
  *
  * @param module - the preview's module, as `import()` gave it; none for a catalogue without one.
  */
@@ -101,4 +105,11 @@ export declare const readPreview: (module: unknown) => LoadedPreview;
  * @param previews - the previews, the catalogue's own last.
  */
 export declare const mergedPreviews: (previews: readonly LoadedPreview[]) => LoadedPreview;
-//# sourceMappingURL=storyModule.d.ts.map
+/**
+ * The globals a story starts from, before the catalogue's switches: the preview's, under the meta's and the story's
+ * own text values. Storybook's order: a story that fixes a global its preview gives a default wins over the default.
+ *
+ * @param preview - the catalogue's preview, merged.
+ * @param story - the story.
+ */
+export declare const startingGlobals: (preview: Pick<LoadedPreview, "globals">, story: Pick<LoadedStory, "globals">) => Record<string, string>;

package/dist/src/frame/storyModule.js

@@ -157,17 +157,50 @@ export const NO_PREVIEW = {
     args: {},
     argTypes: {},
     parameters: {},
+    globals: {},
     setup: undefined
 };
 /**
- * A catalogue's preview read safely, as a story file is: from the default export of its module, or the module itself.
+ * The entries of an object whose values are texts, by the same keys.
+ *
+ * @param values - the values by key.
+ */
+const textsOf = (values) => Object.fromEntries(Object.entries(values).flatMap(([key, value]) => (typeof value === "string" ? [[key, value]] : [])));
+/**
+ * Two sets of fields read as one, as Storybook reads a preview: each field from the first when it has a value there, else
+ * from the second.
+ *
+ * @param first - the fields that win (a preview's default export).
+ * @param second - the fields under them (its named exports).
+ */
+const fieldByField = (first, second) => {
+    const keys = new Set([...Object.keys(second), ...Object.keys(first)]);
+    return Object.fromEntries([...keys].map((key) => [key, first[key] ?? second[key]]));
+};
+/**
+ * The globals a preview starts from, as Storybook starts them: each `globalTypes` entry's `defaultValue`, under
+ * `initialGlobals`. Its decorators read them before anyone touches a toolbar, so without them a decorator that calls
+ * `context.globals.scheme.startsWith` fails on every story. Only texts: `context.globals` holds texts.
+ *
+ * @param preview - the preview's fields.
+ */
+const previewGlobals = (preview) => {
+    const types = isRecord(preview["globalTypes"]) ? preview["globalTypes"] : {};
+    const defaults = Object.fromEntries(Object.entries(types).map(([id, type]) => [id, isRecord(type) ? type["defaultValue"] : undefined]));
+    const initial = isRecord(preview["initialGlobals"]) ? preview["initialGlobals"] : {};
+    return { ...textsOf(defaults), ...textsOf(initial) };
+};
+/**
+ * A catalogue's preview read safely, as a story file is: field by field, as Storybook reads one, the default export's
+ * value or else the module's named export. A preview often writes both (`export const decorators` beside
+ * `export default preview`), and reading only one of them would drop the other's providers without a word.
  *
  * @param module - the preview's module, as `import()` gave it; none for a catalogue without one.
  */
 export const readPreview = (module) => {
     if (!isRecord(module))
         return NO_PREVIEW;
-    const preview = isRecord(module["default"]) ? module["default"] : module;
+    const preview = isRecord(module["default"]) ? fieldByField(module["default"], module) : module;
     const setup = preview["setup"];
     return {
         decorators: decoratorsOf(preview),
@@ -176,6 +209,7 @@ export const readPreview = (module) => {
         args: isRecord(preview["args"]) ? preview["args"] : {},
         argTypes: isRecord(preview["argTypes"]) ? preview["argTypes"] : {},
         parameters: parametersOf(preview),
+        globals: previewGlobals(preview),
         setup: isFunction(setup) ? setup : undefined
     };
 };
@@ -194,6 +228,7 @@ export const mergedPreviews = (previews) => {
         args: Object.assign({}, ...previews.map((preview) => preview.args)),
         argTypes: previews.reduce((merged, preview) => mergedArgTypes(merged, preview.argTypes), {}),
         parameters: Object.fromEntries(previews.flatMap((preview) => Object.entries(preview.parameters))),
+        globals: Object.assign({}, ...previews.map((preview) => preview.globals)),
         setup: setups.length === 0
             ? undefined
             : async () => {
@@ -202,4 +237,11 @@ export const mergedPreviews = (previews) => {
             }
     };
 };
-//# sourceMappingURL=storyModule.js.map
+/**
+ * The globals a story starts from, before the catalogue's switches: the preview's, under the meta's and the story's
+ * own text values. Storybook's order: a story that fixes a global its preview gives a default wins over the default.
+ *
+ * @param preview - the catalogue's preview, merged.
+ * @param story - the story.
+ */
+export const startingGlobals = (preview, story) => ({ ...preview.globals, ...textsOf(story.globals) });

package/dist/src/frame/storyRun.d.ts

@@ -18,8 +18,8 @@ import type { PlayTrace } from "../playTrace.ts";
 import type { ClockState } from "../storyClock.ts";
 import type { FrameClock } from "./frameClock.ts";
 import { type PlayToolsLoader } from "./playStory.ts";
-import type { StoryDrawing, StoryIdentity, StoryRenderer } from "./renderer.ts";
-import type { LoadedStory } from "./storyModule.ts";
+import type { FrameRenderer, StoryDrawing, StoryIdentity } from "./renderer.ts";
+import type { LoadedBeforeEach, LoadedStory } from "./storyModule.ts";
 /** What the shell can do to a running story. */
 export type StoryControls = {
     /** Replays the story, as it declares. */
@@ -50,8 +50,10 @@ export type StoryRunOptions = {
     readonly identity: StoryIdentity;
     /** Loads the play tools the project installed, for the first play; none without them. */
     readonly playTools?: PlayToolsLoader;
+    /** What the plugins prepare before every mount, ahead of the story's loaders. */
+    readonly pluginSetups: readonly LoadedBeforeEach[];
     /** The framework that draws it. */
-    readonly renderer: StoryRenderer;
+    readonly renderer: FrameRenderer;
     /** The story clock the story reads: running from its start for a Live story, held otherwise. */
     readonly clock: FrameClock;
     /** The texts inside the stories in the shown language. */
@@ -69,6 +71,13 @@ export type StoryRunOptions = {
     readonly onControlsReady: (controls: StoryControls) => void;
     /** Called on every call of a recorded event, with its arguments. */
     readonly onEvent: (name: string, values: readonly unknown[]) => void;
+    /** What the panel can show of values: those it cannot (a function, an object) stay the frame's alone. */
+    readonly panelArgsOf: (values: Readonly<Record<string, unknown>>) => PanelArgs;
+    /**
+     * Called when the story changed its own args, after it was drawn again with them, with the panel's values the change
+     * makes, so the panel shows them.
+     */
+    readonly onArgsChange: (args: PanelArgs) => void;
     /** Called with the message when the story throws while it is drawn; the frame shows the error instead. */
     readonly onError: (message: string) => void;
     /** Called with the play function's trace after every change. */
@@ -85,6 +94,15 @@ export type RunningStory = {
      * @param shown - the texts of the language now shown, and the switches' values.
      */
     readonly setShown: (shown: Pick<StoryDrawing, "texts" | "globals">) => void;
+    /**
+     * Draws the story as its edited file now writes it, in place: what the reader did in it stays (a typed field, an
+     * open menu), and so do the values set in the panel. A story with a play, loaders or set-ups is mounted anew, and
+     * they run again, as do the plugins' preparations.
+     *
+     * @param next - the story, read from the edited file.
+     * @param decorators - the decorators around it, when an edit of a preview changed them; the same ones by default.
+     */
+    readonly setStory: (next: LoadedStory, decorators?: StoryDrawing["decorators"]) => void;
 };
 /**
  * Runs a story in its container.
@@ -93,4 +111,3 @@ export type RunningStory = {
  * @returns what the frame can change while it runs.
  */
 export declare const runStory: (options: StoryRunOptions) => RunningStory;
-//# sourceMappingURL=storyRun.d.ts.map

package/dist/src/frame/storyRun.js

@@ -60,6 +60,23 @@ const clearSpies = (args) => {
             Reflect.apply(clear, value, []);
     }
 };
+/** How long a mount waits for the mount before it to be undone, in milliseconds. */
+const CLEANUP_WAIT = 2000;
+/**
+ * Waits for a cleanup, for so long: one that never ends (a mocked request held open) must not keep the story blank for
+ * good, with every later mount behind it.
+ *
+ * @param cleanup - the cleanup, running.
+ * @param wait - the most to wait, in milliseconds.
+ * @throws What the cleanup throws, in time.
+ */
+const settledWithin = async (cleanup, wait) => {
+    let timer;
+    const late = new Promise((resolve) => {
+        timer = setTimeout(resolve, wait);
+    });
+    await Promise.race([cleanup, late]).finally(() => clearTimeout(timer));
+};
 /** A story before its loaders ran, or after its set-ups were undone: nothing loaded, nothing to undo. */
 const NOT_PREPARED = { loaded: {}, cleanup: async () => undefined };
 /**
@@ -69,12 +86,19 @@ const NOT_PREPARED = { loaded: {}, cleanup: async () => undefined };
  * @returns what the frame can change while it runs.
  */
 export const runStory = (options) => {
-    const { container, story, renderer, clock } = options;
+    const { container, renderer, clock } = options;
+    let { story } = options;
     const document = container.ownerDocument;
-    const { decorators } = options;
+    let { decorators } = options;
     let { texts, globals } = options;
     let text = storyTextOf(texts);
     let args = story.args;
+    // the panel's values, kept over the story's own when an edit of its file brings new ones
+    let panelValues = {};
+    // the values the story set itself that the panel cannot show, kept over the panel's until the story resets them
+    let ownValues = {};
+    // the args of the latest drawing: a change that hands back what the story was given changes nothing of it
+    let lastShown = {};
     let eventNames = [];
     let matrix;
     let mounted = [];
@@ -82,8 +106,9 @@ export const runStory = (options) => {
     let mountCount = 0;
     let hasPlayed = false;
     let prepared = NOT_PREPARED;
+    let preparing = Promise.resolve();
     // the story's actions are recorded whatever the shell names: a spy, an `argTypes` action
-    const actions = actionNames(story.args, story.argTypes);
+    let actions = actionNames(story.args, story.argTypes);
     // every recorded event reports its calls, then runs the story's own handler when it has one; the handler is
     // wrapped, not replaced, so a spy stays one (`expect(args.onPress).toHaveBeenCalled()` reads its calls)
     const recorded = () => Object.fromEntries([...new Set([...eventNames, ...actions])].map((name) => {
@@ -114,16 +139,38 @@ export const runStory = (options) => {
         ...withStoryTexts(mappedArgs(args, story.argTypes), text),
         ...recorded()
     });
-    const drawing = (values) => ({
-        identity: options.identity,
-        story,
-        args: { ...shownArgs(), ...values },
-        texts,
-        clock,
-        decorators,
-        globals,
-        loaded: prepared.loaded
-    });
+    const drawing = (values) => {
+        lastShown = { ...shownArgs(), ...values };
+        return {
+            identity: options.identity,
+            story,
+            args: lastShown,
+            texts,
+            clock,
+            decorators,
+            globals,
+            loaded: prepared.loaded,
+            onEvent: options.onEvent,
+            changeArgs
+        };
+    };
+    // the story's own change of its args, kept as the panel's values are (Replay and an edit of its file keep it too); a
+    // value handed back as it was given (`updateArgs({ ...args, count })`) is left out: a recorded event's wrapper or a
+    // text in the shown language would otherwise stand for the story's own
+    const changeArgs = (change) => {
+        const isKept = (name) => change.reset !== "all" && !change.reset.includes(name);
+        const keptOf = (values) => Object.fromEntries(Object.entries(values).filter(([name]) => isKept(name)));
+        const changed = Object.fromEntries(Object.entries(change.set).filter(([name, value]) => value !== lastShown[name]));
+        const shown = options.panelArgsOf(changed);
+        panelValues = { ...keptOf(panelValues), ...changed };
+        ownValues = {
+            ...keptOf(ownValues),
+            ...Object.fromEntries(Object.entries(changed).filter(([name]) => !(name in shown)))
+        };
+        args = { ...story.args, ...ownValues, ...panelValues };
+        redraw();
+        options.onArgsChange(options.panelArgsOf(panelValues));
+    };
     const clearError = () => {
         shownError?.remove();
         shownError = undefined;
@@ -167,7 +214,8 @@ export const runStory = (options) => {
             redraw();
         },
         setPanelArgs: (panelArgs) => {
-            args = { ...story.args, ...options.resolveArgs(panelArgs) };
+            panelValues = options.resolveArgs(panelArgs);
+            args = { ...story.args, ...ownValues, ...panelValues };
             redraw();
         },
         setEvents: (names) => {
@@ -256,15 +304,32 @@ export const runStory = (options) => {
         const previous = prepared;
         prepared = NOT_PREPARED;
         try {
-            await previous.cleanup();
-            const next = await prepareStory(story, {
+            await settledWithin(previous.cleanup(), CLEANUP_WAIT);
+            const context = {
                 ...options.identity,
                 args: shownArgs(),
                 text,
                 clock,
                 globals,
                 parameters: story.parameters
+            };
+            // ahead of the story's loaders, which may depend on them: a mocked API answers a loader's fetch
+            const plugins = await prepareStory({ loaders: [], beforeEach: options.pluginSetups }, context);
+            const hooks = await prepareStory(story, context).catch(async (error) => {
+                await plugins.cleanup();
+                throw error;
             });
+            const next = {
+                ...hooks,
+                cleanup: async () => {
+                    try {
+                        await hooks.cleanup();
+                    }
+                    finally {
+                        await plugins.cleanup();
+                    }
+                }
+            };
             // a later mount started while this one loaded: its set-ups are undone, the later one draws
             if (count !== mountCount) {
                 await next.cleanup();
@@ -280,11 +345,15 @@ export const runStory = (options) => {
         }
     };
     // a new mount draws the story from scratch: its loaders and set-ups run again, its own state starts over and its
-    // play function runs again
+    // play function runs again; it waits for the mount before it, whose set-ups it must undo, and one overtaken meanwhile
+    // never starts: two at once would hold what only one can (a mocked API's worker)
     const mountStory = () => {
         unmountAll();
         mountCount += 1;
-        void prepareMount(mountCount).then((isLast) => {
+        const count = mountCount;
+        const turn = preparing.then(() => (count === mountCount ? prepareMount(count) : false));
+        preparing = turn.then(() => undefined, () => undefined);
+        void turn.then((isLast) => {
             if (!isLast)
                 return;
             // a framework may throw while it starts drawing, before its own error capture is in place: shown as any error
@@ -312,7 +381,19 @@ export const runStory = (options) => {
             ({ texts, globals } = shown);
             text = storyTextOf(texts);
             redraw();
+        },
+        setStory: (next, nextDecorators = decorators) => {
+            story = next;
+            decorators = nextDecorators;
+            actions = actionNames(story.args, story.argTypes);
+            args = { ...story.args, ...ownValues, ...panelValues };
+            // a play drives the story from its start, and loaders and set-ups make what it draws: drawn in place, it would
+            // show what the edit no longer writes
+            const isPrepared = story.play !== undefined || story.loaders.length > 0 || story.beforeEach.length > 0;
+            if (isPrepared)
+                mountStory();
+            else
+                redraw();
         }
     };
 };
-//# sourceMappingURL=storyRun.js.map

package/dist/src/frame/touchDots.d.ts

@@ -29,4 +29,3 @@ export type TouchDots = {
  * @param document - the frame's document.
  */
 export declare const touchDots: (document: Document) => TouchDots;
-//# sourceMappingURL=touchDots.d.ts.map

package/dist/src/frame/touchDots.js

@@ -49,4 +49,3 @@ export const touchDots = (document) => {
         }
     };
 };
-//# sourceMappingURL=touchDots.js.map

package/dist/src/frame/touchEvents.d.ts

@@ -63,4 +63,3 @@ export declare const sendMouse: (type: string, finger: Finger) => boolean;
  * @param finger - the finger that tapped.
  */
 export declare const sendClick: (target: EventTarget, finger: Finger) => void;
-//# sourceMappingURL=touchEvents.d.ts.map

package/dist/src/frame/touchEvents.js

@@ -149,4 +149,3 @@ export const sendClick = (target, finger) => {
         height: CONTACT_PX
     }));
 };
-//# sourceMappingURL=touchEvents.js.map

package/dist/src/frame/touchGesture.d.ts

@@ -77,4 +77,3 @@ export declare const allowedPan: (touchActions: readonly string[]) => PanAxes;
  * @param ms - the time passed.
  */
 export declare const flungSpeed: (speed: number, ms: number) => number;
-//# sourceMappingURL=touchGesture.d.ts.map

package/dist/src/frame/touchGesture.js

@@ -84,4 +84,3 @@ export const flungSpeed = (speed, ms) => {
     const next = speed * FLING_KEPT ** (ms / 16);
     return Math.abs(next) < FLING_STOP ? 0 : next;
 };
-//# sourceMappingURL=touchGesture.js.map

package/dist/src/frame/touchLayer.d.ts

@@ -1,7 +1,7 @@
 /**
- * Follows the root's touch attribute from now on: the simulation runs while it is set.
+ * Starts the simulation in a frame.
  *
  * @param document - the frame's document.
+ * @returns what stops it.
  */
-export declare const followTouch: (document: Document) => void;
-//# sourceMappingURL=touchLayer.d.ts.map
+export declare const startTouch: (document: Document) => (() => void);

package/dist/src/frame/touchLayer.js

@@ -1,6 +1,7 @@
 /**
- * The frame's simulated touch, on while the root has `data-forgebook-touch` (the Touch switch): the real mouse's
- * events are caught before the story and sent again as a finger, or as two with Shift held.
+ * The frame's simulated touch, started and stopped by `followTouch.ts` while the root has `data-forgebook-touch` (the
+ * Touch switch), and loaded the first time it is: the real mouse's events are caught before the story and sent again
+ * as a finger, or as two with Shift held.
  *
  * @remarks
  * A press sends `pointerdown` (touch) and `touchstart`; a move sends `touchmove`, and `pointermove` until a drag
@@ -15,13 +16,10 @@
  *
  * @module
  */
-import { isRealTouchWindow } from "../realTouch.js";
 import { touchDots } from "./touchDots.js";
 import { sendClick, sendMouse, sendPointer, sendTouch } from "./touchEvents.js";
 import { dragAxis, isDragging, LONG_PRESS_MS, mirroredFinger } from "./touchGesture.js";
 import { endPan, panBy, panOf } from "./touchScroll.js";
-/** The root's attribute that turns the simulation on. */
-const TOUCH_ATTRIBUTE = "data-forgebook-touch";
 /** The simulated pointers' ids: apart from the real mouse's, so the browser never confuses them. */
 const FINGER_IDS = [100, 101];
 /** How far apart two fingers start, in CSS px: Shift fixes the centre half of it to the left of the mouse. */
@@ -381,7 +379,7 @@ const CAUGHT = [
  * @param document - the frame's document.
  * @returns what stops it.
  */
-const startTouch = (document) => {
+export const startTouch = (document) => {
     const state = {
         document,
         dots: touchDots(document),
@@ -423,27 +421,3 @@ const startTouch = (document) => {
         state.dots.remove();
     };
 };
-/**
- * Follows the root's touch attribute from now on: the simulation runs while it is set.
- *
- * @param document - the frame's document.
- */
-export const followTouch = (document) => {
-    let stop;
-    // in Chromium's real touch window the pages see real touch: simulating it on top would send every touch twice
-    const view = document.defaultView;
-    if (view !== null && isRealTouchWindow(view))
-        return;
-    const update = () => {
-        const isOn = document.documentElement.hasAttribute(TOUCH_ATTRIBUTE);
-        if (isOn && stop === undefined)
-            stop = startTouch(document);
-        else if (!isOn && stop !== undefined) {
-            stop();
-            stop = undefined;
-        }
-    };
-    new MutationObserver(update).observe(document.documentElement, { attributeFilter: [TOUCH_ATTRIBUTE] });
-    update();
-};
-//# sourceMappingURL=touchLayer.js.map

package/dist/src/frame/touchScroll.d.ts

@@ -48,4 +48,3 @@ export declare const panBy: (pan: Pan, from: Point, to: Point) => void;
  * @param speed - the finger's last speed, in CSS px per ms, per axis.
  */
 export declare const endPan: (pan: Pan, speed: Point) => (() => void);
-//# sourceMappingURL=touchScroll.d.ts.map

package/dist/src/frame/touchScroll.js

@@ -151,4 +151,3 @@ export const endPan = (pan, speed) => {
     // a new touch stops the smooth scroll where it is, as a finger stops a scrolling list
     return () => scroller.scrollTo({ left: scroller.scrollLeft, top: scroller.scrollTop, behavior: "instant" });
 };
-//# sourceMappingURL=touchScroll.js.map