@pie-players/pie-players-shared 0.3.72 → 0.3.74

package/dist/pie/initialization.js

@@ -11,7 +11,7 @@ import { editorPostFix } from "../types/index.js";
 import { initializePieElement } from "./initialize-element.js";
 import { createPieLogger, isGlobalDebugEnabled } from "./logger.js";
 import { initializeMathRendering } from "./math-rendering.js";
-import { pieRegistry } from "./registry.js";
+import { pieRegistry, writeRegistryEntry } from "./registry.js";
 import { defineCustomElementSafely } from "./custom-element-define.js";
 import { validateCustomElementTag } from "./tag-names.js";
 import { BundleType, isCustomElementConstructor, isPieAvailable, Status, } from "./types.js";
@@ -38,6 +38,7 @@ const updateRegisteredElement = (elementTagName, config, session, options, omitE
         config,
         session,
         ...(omitEnv ? {} : { env: options.env }),
+        bundleType: options.bundleType,
         container: options.container,
         ...(options.eventListeners?.[elementTagName] && {
             eventListeners: options.eventListeners[elementTagName],
@@ -119,30 +120,21 @@ const registerPieElementsFromBundle = (elementModule, config, session, registry,
                 : [],
             bundleType: options.bundleType,
         });
-        // Validate controller presence based on bundle type
-        if (!elementData.controller) {
-            if (options.bundleType === BundleType.clientPlayer) {
-                logger.error(`[registerPieElementsFromBundle] ❌ CRITICAL: No controller found for ${pkgStripped}!`);
-                logger.error(`[registerPieElementsFromBundle] Bundle type: ${options.bundleType} (controllers required)`);
-                throw new Error(`No controller found for ${pkgStripped}. client-player.js bundles MUST include controllers!`);
-            }
-            else {
-                logger.debug(`[registerPieElementsFromBundle] ℹ️ No controller found for ${pkgStripped} - using server-processed models (player.js bundle)`);
-            }
-        }
         {
-            // Register the element in our registry
+            // Register the element in our registry. A package without a
+            // controller, such as a legacy `@pie-element/protractor`, renders
+            // the model it is given under client-player.js too.
             logger.debug(`[registerPieElementsFromBundle] Registering ${elName} in registry${elementData.controller
                 ? " with controller"
-                : " (no controller - server-processed models)"}`);
-            registry[elementTagName] = {
+                : " (no controller; its model is used as given)"}`);
+            writeRegistryEntry({
                 package: pkg,
                 status: Status.loading,
                 tagName: elementTagName,
                 controller: elementData.controller || null,
                 config: elementData.config,
                 bundleType: options.bundleType,
-            };
+            });
             if (isCustomElementConstructor(elementData.Element)) {
                 defineCustomElementSafely(elementTagName, elementData.Element, `element tag in config.elements for ${String(pkg)}`);
                 // Initialize existing elements
@@ -155,13 +147,13 @@ const registerPieElementsFromBundle = (elementModule, config, session, registry,
                         session,
                         env: options.env,
                         eventListeners: options.eventListeners?.[elementTagName],
+                        bundleType: options.bundleType,
                     });
                 });
-                // Update registry status
-                registry[elementTagName] = {
+                writeRegistryEntry({
                     ...registry[elementTagName],
                     status: Status.loaded,
-                };
+                });
                 promises.push(customElements.whenDefined(elementTagName).then(() => {
                     logger.debug("[registerPieElementsFromBundle] defined custom PIE element: %s", elementTagName);
                 }));
@@ -297,9 +289,8 @@ export const loadPieModule = async (config, session, opts = {}) => {
                 }
                 catch (error) {
                     // `registerPieElementsFromBundle` throws synchronously for a
-                    // package missing from the bundle and for a client-player
-                    // bundle with no controller. Inside a DOM event handler that
-                    // throw reaches the window instead of the caller.
+                    // package missing from the bundle. Inside a DOM event handler
+                    // that throw reaches the window instead of the caller.
                     fail(error instanceof Error ? error : new Error(String(error)));
                 }
             });

package/dist/pie/initialize-element.d.ts

@@ -6,6 +6,7 @@
  */
 import type { ConfigEntity, Env } from "../types/index.js";
 import type { EventListeners, PieElement } from "./types.js";
+import { BundleType } from "./types.js";
 /**
  * Bind `element` to the model in `options.config` whose `id` matches it.
  *
@@ -20,4 +21,6 @@ export declare const initializePieElement: (element: PieElement, options: {
     session: any[];
     env?: Env;
     eventListeners?: EventListeners;
+    /** The delivering player's bundle type, see `findPieController`. */
+    bundleType?: BundleType;
 }) => boolean;

package/dist/pie/initialize-element.js

@@ -4,7 +4,6 @@
  * Split out of `initialization.ts` so the late-arrival observer in
  * `element-observer.ts` can reuse it without importing the bundle loaders.
  */
-import { wrapModelRichContent } from "../security/wrap-model-rich-content.js";
 import { createPieLogger, isGlobalDebugEnabled } from "./logger.js";
 import { pieRegistry } from "./registry.js";
 import { findPieController } from "./scoring.js";
@@ -21,7 +20,7 @@ const logger = createPieLogger("pie-initialize-element", () => isGlobalDebugEnab
  * separately — uses that to stop at the config the element belongs to.
  */
 export const initializePieElement = (element, options) => {
-    const { config, session, env, eventListeners } = options;
+    const { config, session, env, eventListeners, bundleType } = options;
     if (element.__pieInitialized) {
         return true;
     }
@@ -45,7 +44,7 @@ export const initializePieElement = (element, options) => {
     element.__pieInitialized = true;
     logger.debug(`[initializePieElement] Session set for ${tagName}#${element.id}:`, elementSession);
     // Set model - use controller if available (client-player.js), or use server-processed model (player.js)
-    const controller = findPieController(tagName);
+    const controller = findPieController(tagName, bundleType);
     if (!env) {
         logger.error(`[initializePieElement] ❌ FATAL: No env provided for ${tagName}`);
         throw new Error(`No env provided for ${tagName}. PIE elements require an env object with mode and role.`);
@@ -61,7 +60,7 @@ export const initializePieElement = (element, options) => {
             role: env.role,
         });
         // Set model directly - server already processed it
-        element.model = wrapModelRichContent(model);
+        element.model = model;
     }
     else {
         // Controller available - run client-side processing (client-player.js bundle)

package/dist/pie/instrumentation-event-map.js

@@ -37,7 +37,8 @@ export const SECTION_INSTRUMENTATION_EVENT_MAP = [
     // instrumentation bridge forwards the same names to telemetry. The
     // readiness alias mappings (`readiness-change`, `interaction-ready`,
     // `ready`) and the `section-controller-ready` mapping were removed
-    // alongside their DOM-event surfaces.
+    // alongside their DOM-event surfaces. `session-changed` stays off the
+    // bridge for the reason the item map gives below.
     {
         sourceEventName: "pie-stage-change",
         instrumentationEventName: "pie-section-stage-change",
@@ -46,14 +47,6 @@ export const SECTION_INSTRUMENTATION_EVENT_MAP = [
         sourceEventName: "pie-loading-complete",
         instrumentationEventName: "pie-section-loading-complete",
     },
-    {
-        sourceEventName: "session-changed",
-        instrumentationEventName: "pie-section-session-changed",
-    },
-    {
-        sourceEventName: "composition-changed",
-        instrumentationEventName: "pie-section-composition-changed",
-    },
     {
         sourceEventName: "framework-error",
         instrumentationEventName: "pie-section-framework-error",

package/dist/pie/instrumentation-provider-resolution.d.ts

@@ -1,6 +1,7 @@
+import type { InstrumentationProvider } from "../instrumentation/types.js";
 export declare function resolveInstrumentationProvider(args: {
     runtimePlayer?: unknown;
     player?: unknown;
     debug?: boolean;
     component?: string;
-}): unknown;
+}): InstrumentationProvider | undefined;

package/dist/pie/instrumentation-provider-resolution.js

@@ -37,7 +37,6 @@ const logger = createPieLogger("instrumentation-provider-resolution", () => isGl
 function getDefaultInstrumentationProvider() {
     if (!defaultProvider) {
         defaultProvider = new NewRelicInstrumentationProvider();
-        // New Relic provider sets readiness based on window.newrelic.
         void defaultProvider.initialize();
     }
     return defaultProvider;

package/dist/pie/item-session-contract.d.ts

@@ -1,3 +1,4 @@
+import type { SessionCommitReason } from "./session-commit.js";
 export type ItemSessionContainer = {
     id: string;
     data: unknown[];
@@ -8,10 +9,30 @@ export type NormalizedItemSessionChange = {
     session: ItemSessionContainer | null;
     intent: ItemSessionUpdateIntent;
     component?: string;
+    /**
+     * The id of the element whose change this is: the detail's `elementId`, or
+     * the `id` of an element session record carried as `session`.
+     */
+    elementId?: string;
     complete?: boolean;
+    /** The detail's `sessionCommitReason`, when the change is a commit. */
+    sessionCommitReason?: SessionCommitReason;
 };
 export declare function normalizeItemSessionContainer(input: unknown, fallbackSessionId?: string): ItemSessionContainer;
 export declare function hasResponseValue(value: unknown): boolean;
+/**
+ * Whether an element session holds anything the learner put there.
+ *
+ * Shape-agnostic by necessity: `value` is one element's answer key, and
+ * `response`, `selectedTokens`, `answers`, `answer`, `drawables` are others.
+ * Anything outside the non-response key set with content in it counts, so an
+ * element this function has never heard of is handled by default.
+ *
+ * This is the fallback discriminant for the session commit. The primary one is
+ * a comparison against the session the player last observed, which needs no
+ * schema knowledge at all; see `session-commit.ts`.
+ */
+export declare function hasLearnerResponse(session: unknown): boolean;
 export declare function hasResponseField(value: unknown): boolean;
 export declare function mergeElementIntoSession(itemId: string, previousItemSession: unknown, entryId: string, entry: Record<string, unknown>): ItemSessionContainer;
 export declare function normalizeItemSessionChange(args: {
@@ -19,3 +40,29 @@ export declare function normalizeItemSessionChange(args: {
     sessionDetail: unknown;
     previousItemSession?: unknown;
 }): NormalizedItemSessionChange;
+/**
+ * Create the bare `{ id }` entry `<pie-player>` created at render time, for each
+ * element the item declares. A host that indexes `data[0]` before the learner
+ * has answered finds an entry instead of `undefined`.
+ *
+ * Only the host's container gets these. The authoritative session stays empty
+ * until an element reports something, so an untouched item still saves nothing.
+ */
+export declare function ensureHostSessionEntries(hostContainer: unknown, entryIds: Iterable<string>): boolean;
+/**
+ * Keep the container a host handed in as a live view of the session, the
+ * contract `<pie-player>` had: `findOrAddSession` pushed an entry per element
+ * into the host's own `data` array and the element mutated that entry in place,
+ * so a host read the response off its own object. `ItemController` owns the
+ * session here, so this runs one way and never reads the container back.
+ *
+ * The array and the entry objects keep their identity, for a host holding a
+ * reference into `data`. Entries this player did not produce are left alone: in
+ * a section the host's container spans every item and an item player sees one.
+ *
+ * Inside an entry the player's own session wins, and a key it does not carry is
+ * removed - a cleared response has to clear here too, and the entry belongs to
+ * the element, as it did under `<pie-player>`. A host keeping its own
+ * annotations on an entry keeps them beside it, not inside it.
+ */
+export declare function projectSessionIntoHostContainer(hostContainer: unknown, liveSession: unknown): boolean;

package/dist/pie/item-session-contract.js

@@ -2,6 +2,7 @@ const DEFAULT_SESSION_ID = "";
 const METADATA_ONLY_SESSION_KEYS = new Set([
     "complete",
     "component",
+    "elementId",
     "timestamp",
     "sourceRuntimeId",
 ]);
@@ -71,6 +72,64 @@ export function hasResponseValue(value) {
     }
     return false;
 }
+/**
+ * Keys a delivery element carries on its session that are never learner input:
+ * element identity, the dispatch metadata the event contract defines, and
+ * presentation state a controller writes at load (choice shuffle order).
+ */
+const NON_RESPONSE_SESSION_KEYS = new Set([
+    "id",
+    "element",
+    "complete",
+    "component",
+    "timestamp",
+    "sourceRuntimeId",
+    "shuffledValues",
+]);
+/**
+ * `id` inside an array entry is the response - which hotspot, which choice.
+ * `id` inside an object property that repeats the property's own name is
+ * structure, which is how `explicit-constructed-response` and `ebsr` key their
+ * parts. Distinguishing the two by container is what keeps an unanswered
+ * `{ value: { partA: { id: "partA" } } }` from reading as a response.
+ */
+function carriesContent(value, owningKey) {
+    if (value == null)
+        return false;
+    if (typeof value === "string")
+        return value.trim() !== "";
+    if (typeof value === "number" || typeof value === "boolean")
+        return true;
+    if (Array.isArray(value))
+        return value.some((entry) => carriesContent(entry));
+    if (typeof value !== "object")
+        return false;
+    return Object.entries(value).some(([key, nested]) => {
+        if (key === "id" && owningKey !== undefined && nested === owningKey) {
+            return false;
+        }
+        return carriesContent(nested, key);
+    });
+}
+/**
+ * Whether an element session holds anything the learner put there.
+ *
+ * Shape-agnostic by necessity: `value` is one element's answer key, and
+ * `response`, `selectedTokens`, `answers`, `answer`, `drawables` are others.
+ * Anything outside the non-response key set with content in it counts, so an
+ * element this function has never heard of is handled by default.
+ *
+ * This is the fallback discriminant for the session commit. The primary one is
+ * a comparison against the session the player last observed, which needs no
+ * schema knowledge at all; see `session-commit.ts`.
+ */
+export function hasLearnerResponse(session) {
+    if (!session || typeof session !== "object")
+        return false;
+    if (Array.isArray(session))
+        return session.some(hasLearnerResponse);
+    return Object.entries(session).some(([key, value]) => !NON_RESPONSE_SESSION_KEYS.has(key) && carriesContent(value, key));
+}
 export function hasResponseField(value) {
     if (value == null)
         return false;
@@ -104,6 +163,18 @@ function getMetadataComplete(sessionDetail, candidate) {
         return candidate.complete;
     return undefined;
 }
+/**
+ * `elementRecord` is an element's own session record, whose `id` is the
+ * element's; an item session container's `id` is the item session's.
+ */
+function withElementId(sessionDetail, elementRecord) {
+    const elementId = typeof sessionDetail.elementId === "string" && sessionDetail.elementId
+        ? sessionDetail.elementId
+        : typeof elementRecord?.id === "string" && elementRecord.id
+            ? elementRecord.id
+            : undefined;
+    return elementId ? { elementId } : {};
+}
 function isElementIdentityOnlyPayload(candidate) {
     const candidateKeys = Object.keys(candidate);
     const hasIdentityKey = "id" in candidate || "element" in candidate;
@@ -153,6 +224,14 @@ export function mergeElementIntoSession(itemId, previousItemSession, entryId, en
     };
 }
 export function normalizeItemSessionChange(args) {
+    const change = classifyItemSessionChange(args);
+    const reason = args.sessionDetail
+        ?.sessionCommitReason;
+    return typeof reason === "string" && reason
+        ? { ...change, sessionCommitReason: reason }
+        : change;
+}
+function classifyItemSessionChange(args) {
     const sessionDetail = (args.sessionDetail || {});
     const actualSession = sessionDetail &&
         typeof sessionDetail === "object" &&
@@ -171,6 +250,7 @@ export function normalizeItemSessionChange(args) {
             session: null,
             intent: "metadata-only",
             component: getMetadataComponent(sessionDetail),
+            ...withElementId(sessionDetail),
             complete: getMetadataComplete(sessionDetail),
         };
     }
@@ -183,11 +263,7 @@ export function normalizeItemSessionChange(args) {
         const previousForMetadataComparison = alignPreviousSessionIdForRendererSnapshot(normalizedCandidate, previousNormalized);
         const sessionDetailKeys = Object.keys(sessionDetail);
         const metadataWithSessionOnly = sessionDetailKeys.length > 0 &&
-            sessionDetailKeys.every((key) => key === "session" ||
-                key === "complete" ||
-                key === "component" ||
-                key === "timestamp" ||
-                key === "sourceRuntimeId");
+            sessionDetailKeys.every((key) => key === "session" || METADATA_ONLY_SESSION_KEYS.has(key));
         const hasMetadataBeyondSession = sessionDetailKeys.some((key) => key !== "session");
         if (metadataWithSessionOnly &&
             hasMetadataBeyondSession &&
@@ -198,6 +274,7 @@ export function normalizeItemSessionChange(args) {
                 session: null,
                 intent: "metadata-only",
                 component: getMetadataComponent(sessionDetail),
+                ...withElementId(sessionDetail),
                 complete: getMetadataComplete(sessionDetail),
             };
         }
@@ -208,6 +285,7 @@ export function normalizeItemSessionChange(args) {
                 session: null,
                 intent: "metadata-only",
                 component: getMetadataComponent(sessionDetail),
+                ...withElementId(sessionDetail),
                 complete: getMetadataComplete(sessionDetail),
             };
         }
@@ -216,21 +294,20 @@ export function normalizeItemSessionChange(args) {
             session: normalizedCandidate,
             intent: "replace-item-session",
             component: getMetadataComponent(sessionDetail),
+            ...withElementId(sessionDetail),
             complete: getMetadataComplete(sessionDetail),
         };
     }
     const candidateKeys = Object.keys(candidate);
     const isMetadataOnlyPayload = candidateKeys.length > 0 &&
-        candidateKeys.every((key) => key === "complete" ||
-            key === "component" ||
-            key === "timestamp" ||
-            key === "sourceRuntimeId");
+        candidateKeys.every((key) => METADATA_ONLY_SESSION_KEYS.has(key));
     if (isMetadataOnlyPayload) {
         return {
             itemId: safeItemId,
             session: null,
             intent: "metadata-only",
             component: getMetadataComponent(sessionDetail, candidate),
+            ...withElementId(sessionDetail),
             complete: getMetadataComplete(sessionDetail, candidate),
         };
     }
@@ -240,6 +317,7 @@ export function normalizeItemSessionChange(args) {
             session: null,
             intent: "metadata-only",
             component: getMetadataComponent(sessionDetail, candidate),
+            ...withElementId(sessionDetail, candidate),
             complete: getMetadataComplete(sessionDetail, candidate),
         };
     }
@@ -251,6 +329,115 @@ export function normalizeItemSessionChange(args) {
         session: merged,
         intent: "merge-element-session",
         component,
+        ...withElementId(sessionDetail, candidate),
         complete: getMetadataComplete(sessionDetail, candidate),
     };
 }
+function hostContainerEntries(hostContainer) {
+    if (!isPlainObject(hostContainer)) {
+        return null;
+    }
+    // A frozen container is not a live view of anything, and a shared immutable
+    // default (one object handed to every item) must never take one item's
+    // entries. Both say the same thing: do not project here.
+    if (Object.isFrozen(hostContainer)) {
+        return null;
+    }
+    const existing = hostContainer.data;
+    if (Array.isArray(existing)) {
+        return Object.isFrozen(existing) ? null : existing;
+    }
+    if (existing === undefined || existing === null) {
+        const created = [];
+        hostContainer.data = created;
+        return created;
+    }
+    return null;
+}
+function sessionEntryId(value) {
+    if (!isPlainObject(value)) {
+        return null;
+    }
+    const id = value.id;
+    return typeof id === "string" && id.length > 0 ? id : null;
+}
+/**
+ * Create the bare `{ id }` entry `<pie-player>` created at render time, for each
+ * element the item declares. A host that indexes `data[0]` before the learner
+ * has answered finds an entry instead of `undefined`.
+ *
+ * Only the host's container gets these. The authoritative session stays empty
+ * until an element reports something, so an untouched item still saves nothing.
+ */
+export function ensureHostSessionEntries(hostContainer, entryIds) {
+    const entries = hostContainerEntries(hostContainer);
+    if (!entries) {
+        return false;
+    }
+    let wrote = false;
+    for (const id of entryIds) {
+        if (typeof id !== "string" || id.length === 0) {
+            continue;
+        }
+        if (entries.some((entry) => sessionEntryId(entry) === id)) {
+            continue;
+        }
+        entries.push({ id });
+        wrote = true;
+    }
+    return wrote;
+}
+/**
+ * Keep the container a host handed in as a live view of the session, the
+ * contract `<pie-player>` had: `findOrAddSession` pushed an entry per element
+ * into the host's own `data` array and the element mutated that entry in place,
+ * so a host read the response off its own object. `ItemController` owns the
+ * session here, so this runs one way and never reads the container back.
+ *
+ * The array and the entry objects keep their identity, for a host holding a
+ * reference into `data`. Entries this player did not produce are left alone: in
+ * a section the host's container spans every item and an item player sees one.
+ *
+ * Inside an entry the player's own session wins, and a key it does not carry is
+ * removed - a cleared response has to clear here too, and the entry belongs to
+ * the element, as it did under `<pie-player>`. A host keeping its own
+ * annotations on an entry keeps them beside it, not inside it.
+ */
+export function projectSessionIntoHostContainer(hostContainer, liveSession) {
+    const entries = hostContainerEntries(hostContainer);
+    if (!entries || !isPlainObject(hostContainer)) {
+        return false;
+    }
+    const live = normalizeItemSessionContainer(liveSession);
+    let wrote = false;
+    // The host owns the container id; fill it only when there is nothing there.
+    if (typeof hostContainer.id !== "string") {
+        hostContainer.id = live.id;
+        wrote = true;
+    }
+    for (const nextEntry of live.data) {
+        const id = sessionEntryId(nextEntry);
+        if (!id || !isPlainObject(nextEntry)) {
+            continue;
+        }
+        const target = entries.find((entry) => sessionEntryId(entry) === id);
+        if (!isPlainObject(target)) {
+            entries.push({ ...nextEntry });
+            wrote = true;
+            continue;
+        }
+        for (const key of Object.keys(target)) {
+            if (!(key in nextEntry)) {
+                delete target[key];
+                wrote = true;
+            }
+        }
+        for (const [key, value] of Object.entries(nextEntry)) {
+            if (target[key] !== value) {
+                target[key] = value;
+                wrote = true;
+            }
+        }
+    }
+    return wrote;
+}

package/dist/pie/markup-math.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Math in an item's own markup: what the item and passage markup carry outside
+ * every PIE element.
+ *
+ * Each element typesets its own subtree, so the player hands its renderer only
+ * the markup around them. A renderer finds math below the element it is given,
+ * so no root holds a PIE element: the markup splits into the elements that hold
+ * none, and math sharing a parent with one is wrapped in a span of its own.
+ */
+import type { MathRenderer } from "./math-rendering.js";
+/**
+ * The parts of `container` holding math and no PIE element, each one a root to
+ * typeset. `pieTags` are the tag names of the PIE elements its markup places.
+ */
+export declare function collectMarkupMathRoots(container: HTMLElement, pieTags: ReadonlySet<string>): HTMLElement[];
+/**
+ * Typesets the math in `containers` outside every PIE element with `render`,
+ * one root at a time.
+ */
+export declare function typesetMarkupMath(containers: Iterable<HTMLElement>, pieTags: ReadonlySet<string>, render: MathRenderer): Promise<void>;

package/dist/pie/markup-math.js

@@ -0,0 +1,118 @@
+/**
+ * Math in an item's own markup: what the item and passage markup carry outside
+ * every PIE element.
+ *
+ * Each element typesets its own subtree, so the player hands its renderer only
+ * the markup around them. A renderer finds math below the element it is given,
+ * so no root holds a PIE element: the markup splits into the elements that hold
+ * none, and math sharing a parent with one is wrapped in a span of its own.
+ */
+/** TeX as `@pie-element/shared-math-rendering-mathjax` detects it. */
+const TEX = /\\\(|\\\[|\$\$|\\\$|\\begin\{|\\(?:eq)?ref\{/;
+/** The same, with `$…$` inline math turned on by the legacy opt-in. */
+const TEX_WITH_SINGLE_DOLLAR = /\\\(|\\\[|\$|\\begin\{|\\(?:eq)?ref\{/;
+/** Elements whose content MathJax leaves alone, as both PIE configurations list them. */
+const SKIPPED_ELEMENTS = new Set([
+    "script",
+    "noscript",
+    "style",
+    "textarea",
+    "pre",
+    "code",
+    "annotation",
+    "annotation-xml",
+    "mjx-container",
+    "mjx-assistive-mml",
+]);
+/** The class an author marks content with to keep MathJax out of it. */
+const IGNORED_CLASS = /(?:^|\s)mathjax_ignore(?:\s|$)/;
+const HTML_NAMESPACE = "http://www.w3.org/1999/xhtml";
+function texPattern() {
+    const legacy = globalThis["@pie-lib/math-rendering@2"];
+    return legacy?.opts?.useSingleDollar ? TEX_WITH_SINGLE_DOLLAR : TEX;
+}
+function isSkipped(element) {
+    return (SKIPPED_ELEMENTS.has(element.localName) ||
+        IGNORED_CLASS.test(element.getAttribute("class") ?? ""));
+}
+/** Math a renderer would only find on `element` itself, never below it. */
+function holdsOwnMath(element) {
+    return (element.localName === "math" ||
+        (element.hasAttribute("data-latex") &&
+            !element.hasAttribute("data-math-handled")));
+}
+function holdsMath(element, tex) {
+    if (holdsOwnMath(element) ||
+        element.querySelector("[data-latex]:not([data-math-handled])")) {
+        return true;
+    }
+    for (const math of element.getElementsByTagName("math")) {
+        if (!math.closest("mjx-assistive-mml"))
+            return true;
+    }
+    return tex.test(element.textContent ?? "");
+}
+function wrapInSpan(node) {
+    const span = (node.ownerDocument ?? document).createElement("span");
+    node.replaceWith(span);
+    span.append(node);
+    return span;
+}
+/**
+ * The parts of `container` holding math and no PIE element, each one a root to
+ * typeset. `pieTags` are the tag names of the PIE elements its markup places.
+ */
+export function collectMarkupMathRoots(container, pieTags) {
+    const tex = texPattern();
+    const holdsPie = new Set();
+    for (const tag of pieTags) {
+        for (const element of container.getElementsByTagName(tag)) {
+            for (let ancestor = element.parentElement; ancestor && !holdsPie.has(ancestor); ancestor = ancestor.parentElement) {
+                holdsPie.add(ancestor);
+                if (ancestor === container)
+                    break;
+            }
+        }
+    }
+    if (!holdsPie.has(container)) {
+        return holdsMath(container, tex) ? [container] : [];
+    }
+    const roots = [];
+    const visit = (parent) => {
+        for (const child of [...parent.childNodes]) {
+            if (child.nodeType === Node.TEXT_NODE) {
+                if (tex.test(child.data))
+                    roots.push(wrapInSpan(child));
+                continue;
+            }
+            if (child.nodeType !== Node.ELEMENT_NODE)
+                continue;
+            const element = child;
+            if (pieTags.has(element.localName) || isSkipped(element))
+                continue;
+            if (holdsPie.has(element)) {
+                visit(element);
+            }
+            else if (holdsMath(element, tex)) {
+                if (holdsOwnMath(element)) {
+                    roots.push(wrapInSpan(element));
+                }
+                else if (element.namespaceURI === HTML_NAMESPACE) {
+                    roots.push(element);
+                }
+            }
+        }
+    };
+    visit(container);
+    return roots;
+}
+/**
+ * Typesets the math in `containers` outside every PIE element with `render`,
+ * one root at a time.
+ */
+export async function typesetMarkupMath(containers, pieTags, render) {
+    const roots = [...containers].flatMap((container) => collectMarkupMathRoots(container, pieTags));
+    for (const root of roots) {
+        await render(root);
+    }
+}