@eintrek/erp-shell 0.1.65 → 0.1.67

package/dist/index.js

@@ -1975,7 +1975,7 @@ function platformApiBase(app) {
  * This package's version, attached to help messages so the back office can
  * tell which shell a report came from. Keep in step with package.json.
  */
-const SHELL_VERSION = "0.1.65";
+const SHELL_VERSION = "0.1.67";
 
 const HELP_APP_LABEL = {
     platform: "แพลตฟอร์ม",
@@ -3832,6 +3832,7 @@ function initialGuideState(audience, progress) {
         chipPulse: 0,
         nudge: 0,
         gateDismissed: false,
+        replayPage: null,
     };
 }
 function findMission(suite, key) {
@@ -3889,6 +3890,38 @@ function targetIdOf(step, ctx) {
         return safe(() => step.targetId(ctx), undefined);
     return step.targetId;
 }
+/**
+ * A commit step with nothing to save: its button is not on the page, and what
+ * is saved is (GuideStep.nothingToSave).
+ */
+function nothingToSaveHolds(step, env, ctx) {
+    const n = step.nothingToSave;
+    if (!n || !step.target)
+        return false;
+    return !env.isVisible(step.target, targetIdOf(step, ctx)) && env.isVisible(n.target);
+}
+/**
+ * The step as it is shown: a commit step with nothing to save is a read step
+ * on what is saved, with its own title (ถัดไป moves on).
+ */
+function shownStep(step, nothingToSave) {
+    const n = step.nothingToSave;
+    if (!nothingToSave || !n)
+        return step;
+    return {
+        key: step.key,
+        kind: "view",
+        target: n.target,
+        title: n.title,
+        why: n.why,
+        allow: n.allow,
+        route: step.route,
+        resumeUrl: step.resumeUrl,
+        checkpoint: step.checkpoint,
+        timeoutMs: step.timeoutMs,
+        abort: step.abort,
+    };
+}
 /** Whether the step's target (or the bridge's) is on screen. */
 function stepTargetVisible(step, env, ctx, bridge) {
     if (bridge)
@@ -3957,6 +3990,30 @@ function abortActionsFor(mission, index) {
         return [];
     return [{ escape: true }];
 }
+/** Every anchor the mission's abort actions press. */
+function abortAnchorsOf(mission) {
+    const out = new Set();
+    const add = (a) => {
+        for (const x of a ? (Array.isArray(a) ? a : [a]) : [])
+            if ("click" in x)
+                out.add(x.click);
+    };
+    add(mission.abort);
+    for (const st of mission.steps)
+        add(st.abort);
+    return Array.from(out);
+}
+/**
+ * What the replay may do to put the page back: not press what the user had
+ * open before it started, not Escape out of a dialog that was already open,
+ * and no app event while anything of theirs was open.
+ */
+function abortActionsLeft(actions, before) {
+    if (!before)
+        return actions;
+    const busy = before.anchors.length > 0 || before.dialog;
+    return actions.filter(a => "click" in a ? !before.anchors.includes(a.click) : "escape" in a ? !before.dialog : !busy);
+}
 function routeParamsFor(step, env) {
     if (!step.route)
         return {};
@@ -4095,7 +4152,7 @@ function announceStep(d, suite, env) {
     const mission = findMission(suite, s.mission);
     if (!mission)
         return;
-    const step = mission.steps[s.index];
+    const step = shownStep(mission.steps[s.index], s.nothingToSave);
     const ctx = guideContext(env, d.state.progress.context, routeParamsFor(step, env));
     const title = s.bridge ? COPY.bridgeTitle : plainTitle(resolveText(step.title, ctx));
     const why = s.bridge ? COPY.bridgeWhy(suite.appName) : plainTitle(resolveText(step.why, ctx));
@@ -4163,6 +4220,7 @@ function enterStep(d, suite, env, mission, index, opts) {
         confirmExit: false,
         misses: 0,
         armed: hiddenAnchorShown(step, env),
+        nothingToSave: !away && !bridge && nothingToSaveHolds(step, env, ctx),
     });
     if (!opts.replay) {
         const cp = checkpointAtOrBefore(steps, i);
@@ -4180,6 +4238,28 @@ function enterStep(d, suite, env, mission, index, opts) {
         markReadyIfVisible(d, suite, env);
     }
 }
+/**
+ * The save button came (a change) or went (nothing left to save): show the
+ * commit step's other form. A ready step whose new target is not there is
+ * left to the target-lost path (back to the checkpoint).
+ */
+function setNothingToSave(d, suite, env, on) {
+    const s = d.state.screen;
+    if (s.name !== "step" || s.nothingToSave === on)
+        return;
+    setScreen(d, { ...s, nothingToSave: on, error: null });
+    if (s.phase !== "ready") {
+        markReadyIfVisible(d, suite, env);
+        return;
+    }
+    const mission = findMission(suite, s.mission);
+    if (!mission)
+        return;
+    const step = shownStep(mission.steps[s.index], on);
+    const ctx = guideContext(env, d.state.progress.context, routeParamsFor(step, env));
+    if (stepTargetVisible(step, env, ctx, s.bridge))
+        announceStep(d, suite, env);
+}
 function markReadyIfVisible(d, suite, env) {
     const s = d.state.screen;
     if (s.name !== "step" || s.phase !== "waiting")
@@ -4187,7 +4267,7 @@ function markReadyIfVisible(d, suite, env) {
     const mission = findMission(suite, s.mission);
     if (!mission)
         return;
-    const step = mission.steps[s.index];
+    const step = shownStep(mission.steps[s.index], s.nothingToSave);
     const ctx = guideContext(env, d.state.progress.context, routeParamsFor(step, env));
     if (stepTargetVisible(step, env, ctx, s.bridge)) {
         setScreen(d, { ...s, phase: "ready" });
@@ -4309,6 +4389,17 @@ function startMission(d, suite, env, key, replay) {
         if (at > 0)
             index = checkpointAtOrBefore(mission.steps, at);
     }
+    if (isReplay) {
+        // What is open now is the user's: ending the replay leaves it alone.
+        d.state = {
+            ...d.state,
+            replayPage: {
+                mission: key,
+                anchors: abortAnchorsOf(mission).filter(a => safe(() => env.isVisible(a), false)),
+                dialog: safe(() => env.dialogOpen?.() === true, false),
+            },
+        };
+    }
     enterStep(d, suite, env, mission, index, { replay: isReplay });
     // A replay never writes progress; only what starting it changed (the
     // welcome, first seen through a replay) is saved.
@@ -4369,7 +4460,8 @@ function pushAbort(d, suite, s) {
     const mission = findMission(suite, s.mission);
     if (!mission)
         return;
-    const actions = abortActionsFor(mission, s.index);
+    const before = d.state.replayPage?.mission === s.mission ? d.state.replayPage : null;
+    const actions = abortActionsLeft(abortActionsFor(mission, s.index), before);
     if (actions.length)
         d.effects.push({ type: "abort", actions });
 }
@@ -4462,7 +4554,12 @@ function reduceGuide(state, action, suite, env) {
             }
             if (s.confirmExit)
                 break;
-            const kind = stepKind(step);
+            const nts = !s.bridge && nothingToSaveHolds(step, env, ctx);
+            if (nts !== s.nothingToSave) {
+                setNothingToSave(d, suite, env, nts);
+                break;
+            }
+            const kind = stepKind(shownStep(step, s.nothingToSave));
             const armed = s.armed || hiddenAnchorShown(step, env);
             if (kind !== "input" && kind !== "view") {
                 const held = syncTriggerHolds(step, env, armed);
@@ -4471,7 +4568,7 @@ function reduceGuide(state, action, suite, env) {
                     break;
                 }
             }
-            if (!s.bridge && !stepTargetVisible(step, env, ctx, false) && offRoute(mission.steps, s.index, env)) {
+            if (!s.bridge && !stepTargetVisible(shownStep(step, s.nothingToSave), env, ctx, false) && offRoute(mission.steps, s.index, env)) {
                 // The target is missing because the page is another one.
                 recoverOffRoute(d, suite, env, false);
                 break;
@@ -4542,8 +4639,9 @@ function reduceGuide(state, action, suite, env) {
             if (!mission)
                 break;
             const step = mission.steps[s.index];
-            const kind = stepKind(step);
+            const kind = stepKind(shownStep(step, s.nothingToSave));
             if (kind === "view") {
+                // A read step, or a commit step with nothing to save.
                 advance(d, suite, env);
                 break;
             }
@@ -4572,21 +4670,24 @@ function reduceGuide(state, action, suite, env) {
             const mission = findMission(suite, s.mission);
             if (!mission)
                 break;
-            const step = mission.steps[s.index];
-            const ctx = guideContext(env, d.state.progress.context, routeParamsFor(step, env));
-            if (stepTargetVisible(step, env, ctx, s.bridge))
+            const raw = mission.steps[s.index];
+            const ctx = guideContext(env, d.state.progress.context, routeParamsFor(raw, env));
+            // The save went with nothing left to save, or came back: the other form.
+            setNothingToSave(d, suite, env, !s.bridge && nothingToSaveHolds(raw, env, ctx));
+            const cur = d.state.screen;
+            if (stepTargetVisible(shownStep(raw, cur.nothingToSave), env, ctx, cur.bridge))
                 break;
-            if (!s.bridge && offRoute(mission.steps, s.index, env)) {
+            if (!cur.bridge && offRoute(mission.steps, cur.index, env)) {
                 recoverOffRoute(d, suite, env, false);
                 break;
             }
-            const cp = checkpointAtOrBefore(mission.steps, s.index);
-            if (cp < s.index && !s.bridge) {
+            const cp = checkpointAtOrBefore(mission.steps, cur.index);
+            if (cp < cur.index && !cur.bridge) {
                 // A dialog or a menu closed under the step: back to what opens it.
-                enterStep(d, suite, env, mission, cp, { replay: s.replay, noAutoPass: false });
+                enterStep(d, suite, env, mission, cp, { replay: cur.replay, noAutoPass: false });
             }
             else {
-                setScreen(d, { ...s, phase: "waiting" });
+                setScreen(d, { ...cur, phase: "waiting" });
             }
             break;
         }
@@ -5178,6 +5279,12 @@ function coveredByDialog(el) {
     }
     return false;
 }
+/** An app dialog (not the tour's) is open on the page. */
+function appDialogOpen() {
+    if (!hasDocument())
+        return false;
+    return Array.from(document.querySelectorAll(OPEN_DIALOG_SELECTOR)).some(d => !inGuideLayer(d) && isPresent(d));
+}
 function openPoppers() {
     if (!hasDocument())
         return [];
@@ -6216,6 +6323,7 @@ function GuideHostInner({ config, organizationId, code }) {
             isVisible: (anchor, id) => anchorVisible(anchor, id),
             sidebarOpen: pg.sidebarOpen,
             targetValue: () => fieldValue(targetElRef.current),
+            dialogOpen: () => appDialogOpen(),
         };
     }, [code]);
     /* ---------------- effects: save, announce, toast, navigate ---------------- */
@@ -6392,11 +6500,13 @@ function GuideHostInner({ config, organizationId, code }) {
         const mission = findMission(suite, screen.mission);
         if (!mission)
             return null;
-        const step = mission.steps[screen.index];
-        if (!step)
+        const raw = mission.steps[screen.index];
+        if (!raw)
             return null;
+        // A commit step with nothing to save is shown as its read form.
+        const step = shownStep(raw, screen.nothingToSave);
         const missionNo = suite.missions.indexOf(mission) + 1;
-        return { mission, step, missionNo };
+        return { mission, step, raw, missionNo };
     }, [state, screen, suite]);
     const stepCtx = React.useMemo(() => {
         if (!state)
@@ -6412,7 +6522,7 @@ function GuideHostInner({ config, organizationId, code }) {
         : null;
     const targetKey = target ? `${target.anchor}|${target.id ?? ""}` : "";
     const phase = screen.name === "step" ? screen.phase : null;
-    const stepId = screen.name === "step" ? `${screen.mission}:${screen.index}:${screen.bridge ? "b" : ""}` : "";
+    const stepId = screen.name === "step" ? `${screen.mission}:${screen.index}:${screen.bridge ? "b" : ""}${screen.nothingToSave ? "n" : ""}` : "";
     /* Measure every frame while a step is shown: the spotlight follows
        scrolling, dialogs animating in, the drawer sliding, the keyboard. */
     const [layout, setLayout] = React.useState({
@@ -6575,7 +6685,7 @@ function GuideHostInner({ config, organizationId, code }) {
             dispatchRef.current({ type: "signal", signal: { kind: "api", method: d.method, path: d.path, status: d.status, id: d.id, message: d.message } });
         };
         window.addEventListener(API_EVENT, onApi);
-        const names = triggersOf(stepInfo.step).flatMap(t => ("event" in t ? [t.event] : []));
+        const names = triggersOf(stepInfo.raw).flatMap(t => ("event" in t ? [t.event] : []));
         const onApp = (name) => (e) => dispatchRef.current({ type: "signal", signal: { kind: "event", name, detail: e.detail ?? undefined } });
         const appHandlers = names.map(n => [GUIDE_EVENT_PREFIX + n, onApp(n)]);
         appHandlers.forEach(([n, h]) => window.addEventListener(n, h));
@@ -6807,21 +6917,18 @@ function GuideHostInner({ config, organizationId, code }) {
     React.useEffect(() => {
         const el = document.createElement("div");
         el.setAttribute(GUIDE_LAYER_ATTRIBUTE, "");
-        // A Radix modal (dialog, select, menu) hides everything outside it from
-        // screen readers with aria-hidden's hideOthers. It leaves [aria-live]
-        // elements and their insides alone, but walks into their ancestors and
-        // hides the siblings: with only the status line live, the bubble and its
-        // buttons were hidden. "off" announces nothing; it only makes the whole
-        // layer one of the kept elements.
-        el.setAttribute("aria-live", "off");
         document.body.appendChild(el);
         layerRef.current = el;
         setLayer(el);
-        // And should anything still hide the layer or a part of it (another
-        // library, a later hideOthers), take it off again. hideOthers marks what
-        // it hides with data-aria-hidden (the layer never sets that, or inert);
-        // aria-hidden goes only where it was just added, so the layer's own
-        // decorative aria-hidden stays.
+        // A Radix modal (dialog, select, menu) hides everything outside it from
+        // screen readers with aria-hidden's hideOthers. It keeps [aria-live]
+        // elements but walks into their ancestors and hides the other children:
+        // with the status line live, the bubble and its buttons were hidden.
+        // Take off what it adds, at once. hideOthers marks what it hides with
+        // data-aria-hidden (the layer never sets that, or inert); aria-hidden goes
+        // only where it was just added, so the layer's own decorative aria-hidden
+        // stays. (aria-live="off" on the layer would make hideOthers skip it, but
+        // it changed what test tools match by text.)
         const obs = new MutationObserver(records => {
             for (const r of records) {
                 const n = r.target;