@k2b/ui 0.29.0 → 0.31.0

package/dist/browser/feedback/MovedHint.js

@@ -0,0 +1,197 @@
+import { template as _$template } from "solid-js/web";
+import { className as _$className } from "solid-js/web";
+import { effect as _$effect } from "solid-js/web";
+import { getNextElement as _$getNextElement } from "solid-js/web";
+import { getNextMarker as _$getNextMarker } from "solid-js/web";
+import { createComponent as _$createComponent } from "solid-js/web";
+import { insert as _$insert } from "solid-js/web";
+import { setAttribute as _$setAttribute } from "solid-js/web";
+import { use as _$use } from "solid-js/web";
+var _tmpl$ = /*#__PURE__*/_$template(`<div popover=manual role=group><p class=k2b-moved-hint__text></p><div class=k2b-moved-hint__actions><!$><!/><!$><!/>`);
+import { createEffect, createSignal, createUniqueId, onCleanup, onMount, Show } from "solid-js";
+import { Button, ButtonLink } from "../actions/Button";
+import { useUiMessages } from "../intl/messages";
+import { announce } from "./announce";
+import { positionTooltipSurface } from "./tooltip-position";
+export function MovedHint(props) {
+  const messages = useUiMessages();
+  const textId = `k2b-moved-hint-${createUniqueId()}`;
+  const [mounted, setMounted] = createSignal(false);
+  const [dismissed, setDismissed] = createSignal(false);
+  let surface;
+  let text;
+  let previousFocus;
+  let shown = false;
+  let announced = false;
+  const hide = () => {
+    if (!shown) return;
+    shown = false;
+    try {
+      surface?.hidePopover?.();
+    } catch {
+      // Cleanup can run after the surface disconnects.
+    }
+  };
+  const dismiss = restoreFocus => {
+    if (!props.open || dismissed()) return false;
+    const focusInside = surface?.contains(document.activeElement);
+    const target = props.target();
+    const returnTo = previousFocus?.isConnected && !previousFocus.matches(":disabled") ? previousFocus : target && (target.tabIndex >= 0 || target.hasAttribute("tabindex")) && !target.matches(":disabled") ? target : undefined;
+    hide();
+    if (restoreFocus && focusInside && returnTo) {
+      returnTo.focus({
+        preventScroll: true
+      });
+    }
+    setDismissed(true);
+    props.onDismiss();
+    return true;
+  };
+  createEffect(() => {
+    if (!props.open) {
+      setDismissed(false);
+      previousFocus = undefined;
+    }
+  });
+  onMount(() => setMounted(true));
+  createEffect(() => {
+    if (!mounted() || !props.open || dismissed()) return;
+    const anchor = props.target();
+    const placement = props.placement ?? "bottom";
+    if (!surface || !anchor) return;
+
+    // A target scrolled out of view, or clipped by its scroller, takes the hint along instead of leaving it
+    // pinned to the viewport edge over unrelated content.
+    let inView = typeof IntersectionObserver === "undefined";
+    const position = () => {
+      if (!props.open || dismissed() || !inView || !anchor.isConnected || anchor.getClientRects().length === 0) {
+        hide();
+        return;
+      }
+      if (!surface || typeof surface.showPopover !== "function") return;
+      if (!shown) {
+        try {
+          surface.showPopover();
+          shown = true;
+        } catch {
+          return;
+        }
+      }
+      positionTooltipSurface(surface, anchor, placement);
+      if (!announced) {
+        announced = true;
+        announce(text?.textContent ?? "");
+      }
+    };
+    const focusIn = event => {
+      if (!(event.relatedTarget instanceof Node) || !surface?.contains(event.relatedTarget)) {
+        previousFocus = event.relatedTarget instanceof HTMLElement ? event.relatedTarget : undefined;
+      }
+    };
+    const keydown = event => {
+      if (event.defaultPrevented || event.isComposing) return;
+      if (event.key !== "Escape" || !(event.target instanceof Node)) return;
+      if (!surface?.contains(event.target) && !anchor.contains(event.target)) return;
+      event.preventDefault();
+      dismiss(true);
+    };
+    const observer = typeof ResizeObserver === "undefined" ? undefined : new ResizeObserver(position);
+    observer?.observe(anchor);
+    const visibility = typeof IntersectionObserver === "undefined" ? undefined : new IntersectionObserver(entries => {
+      inView = entries.at(-1)?.isIntersecting ?? inView;
+      position();
+    });
+    visibility?.observe(anchor);
+    surface.addEventListener("focusin", focusIn);
+    document.addEventListener("keydown", keydown);
+    window.addEventListener("resize", position);
+    window.addEventListener("scroll", position, {
+      capture: true,
+      passive: true
+    });
+    position();
+    onCleanup(() => {
+      observer?.disconnect();
+      visibility?.disconnect();
+      surface?.removeEventListener("focusin", focusIn);
+      document.removeEventListener("keydown", keydown);
+      window.removeEventListener("resize", position);
+      window.removeEventListener("scroll", position, true);
+      hide();
+    });
+  });
+  return _$createComponent(Show, {
+    get when() {
+      return props.open;
+    },
+    get children() {
+      var _el$ = _$getNextElement(_tmpl$),
+        _el$2 = _el$.firstChild,
+        _el$3 = _el$2.nextSibling,
+        _el$4 = _el$3.firstChild,
+        [_el$5, _co$] = _$getNextMarker(_el$4.nextSibling),
+        _el$6 = _el$5.nextSibling,
+        [_el$7, _co$2] = _$getNextMarker(_el$6.nextSibling);
+      var _ref$ = surface;
+      typeof _ref$ === "function" ? _$use(_ref$, _el$) : surface = _el$;
+      _$setAttribute(_el$, "aria-labelledby", textId);
+      var _ref$2 = text;
+      typeof _ref$2 === "function" ? _$use(_ref$2, _el$2) : text = _el$2;
+      _$setAttribute(_el$2, "id", textId);
+      _$insert(_el$2, () => props.children);
+      _$insert(_el$3, _$createComponent(Show, {
+        get when() {
+          return props.action.href !== undefined;
+        },
+        get fallback() {
+          return _$createComponent(Button, {
+            size: "sm",
+            variant: "secondary",
+            type: "button",
+            onClick: () => {
+              const action = props.action;
+              if (dismiss(false)) action.onClick?.();
+            },
+            get children() {
+              return props.action.label;
+            }
+          });
+        },
+        get children() {
+          return _$createComponent(ButtonLink, {
+            size: "sm",
+            variant: "secondary",
+            get href() {
+              return props.action.href;
+            },
+            onClick: () => dismiss(false),
+            get children() {
+              return props.action.label;
+            }
+          });
+        }
+      }), _el$5, _co$);
+      _$insert(_el$3, _$createComponent(Button, {
+        size: "sm",
+        variant: "ghost",
+        type: "button",
+        onClick: () => dismiss(true),
+        get children() {
+          return messages().movedHintDismiss;
+        }
+      }), _el$7, _co$2);
+      _$effect(_p$ => {
+        var _v$ = `k2b-moved-hint${props.class ? ` ${props.class}` : ""}`,
+          _v$2 = props.placement ?? "bottom";
+        _v$ !== _p$.e && _$className(_el$, _p$.e = _v$);
+        _v$2 !== _p$.t && _$setAttribute(_el$, "data-placement", _p$.t = _v$2);
+        return _p$;
+      }, {
+        e: undefined,
+        t: undefined
+      });
+      return _el$;
+    }
+  });
+}
+//# sourceMappingURL=MovedHint.js.map

package/dist/browser/feedback/MovedHint.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["feedback/MovedHint.tsx"],"sourcesContent":["import { createEffect, createSignal, createUniqueId, type JSX, onCleanup, onMount, Show } from \"solid-js\";\nimport { Button, ButtonLink } from \"../actions/Button\";\nimport { useUiMessages } from \"../intl/messages\";\nimport { announce } from \"./announce\";\nimport { positionTooltipSurface, type TooltipPlacement } from \"./tooltip-position\";\n\nexport type MovedHintAction = { label: string; href: string; onClick?: never } | { label: string; onClick: () => void; href?: never };\n\nexport type MovedHintProps = {\n  /** The owner decides this on the server, so a dismissed hint never renders again. */\n  open: boolean;\n  /** Called once per open period when the person closes the hint or uses its action. */\n  onDismiss: () => void;\n  /** Render the hint directly after this element to preserve keyboard order. */\n  target: () => HTMLElement | undefined;\n  /** Short text naming the new place. */\n  children: JSX.Element;\n  action: MovedHintAction;\n  placement?: TooltipPlacement;\n  class?: string;\n};\n\nexport function MovedHint(props: MovedHintProps): JSX.Element {\n  const messages = useUiMessages();\n  const textId = `k2b-moved-hint-${createUniqueId()}`;\n  const [mounted, setMounted] = createSignal(false);\n  const [dismissed, setDismissed] = createSignal(false);\n  let surface: HTMLDivElement | undefined;\n  let text: HTMLParagraphElement | undefined;\n  let previousFocus: HTMLElement | undefined;\n  let shown = false;\n  let announced = false;\n\n  const hide = () => {\n    if (!shown) return;\n    shown = false;\n    try {\n      surface?.hidePopover?.();\n    } catch {\n      // Cleanup can run after the surface disconnects.\n    }\n  };\n\n  const dismiss = (restoreFocus: boolean): boolean => {\n    if (!props.open || dismissed()) return false;\n    const focusInside = surface?.contains(document.activeElement);\n    const target = props.target();\n    const returnTo =\n      previousFocus?.isConnected && !previousFocus.matches(\":disabled\")\n        ? previousFocus\n        : target && (target.tabIndex >= 0 || target.hasAttribute(\"tabindex\")) && !target.matches(\":disabled\")\n          ? target\n          : undefined;\n    hide();\n    if (restoreFocus && focusInside && returnTo) {\n      returnTo.focus({ preventScroll: true });\n    }\n    setDismissed(true);\n    props.onDismiss();\n    return true;\n  };\n\n  createEffect(() => {\n    if (!props.open) {\n      setDismissed(false);\n      previousFocus = undefined;\n    }\n  });\n  onMount(() => setMounted(true));\n\n  createEffect(() => {\n    if (!mounted() || !props.open || dismissed()) return;\n    const anchor = props.target();\n    const placement = props.placement ?? \"bottom\";\n    if (!surface || !anchor) return;\n\n    // A target scrolled out of view, or clipped by its scroller, takes the hint along instead of leaving it\n    // pinned to the viewport edge over unrelated content.\n    let inView = typeof IntersectionObserver === \"undefined\";\n    const position = () => {\n      if (!props.open || dismissed() || !inView || !anchor.isConnected || anchor.getClientRects().length === 0) {\n        hide();\n        return;\n      }\n      if (!surface || typeof surface.showPopover !== \"function\") return;\n      if (!shown) {\n        try {\n          surface.showPopover();\n          shown = true;\n        } catch {\n          return;\n        }\n      }\n      positionTooltipSurface(surface, anchor, placement);\n      if (!announced) {\n        announced = true;\n        announce(text?.textContent ?? \"\");\n      }\n    };\n    const focusIn = (event: FocusEvent) => {\n      if (!(event.relatedTarget instanceof Node) || !surface?.contains(event.relatedTarget)) {\n        previousFocus = event.relatedTarget instanceof HTMLElement ? event.relatedTarget : undefined;\n      }\n    };\n    const keydown = (event: KeyboardEvent) => {\n      if (event.defaultPrevented || event.isComposing) return;\n      if (event.key !== \"Escape\" || !(event.target instanceof Node)) return;\n      if (!surface?.contains(event.target) && !anchor.contains(event.target)) return;\n      event.preventDefault();\n      dismiss(true);\n    };\n    const observer = typeof ResizeObserver === \"undefined\" ? undefined : new ResizeObserver(position);\n    observer?.observe(anchor);\n    const visibility =\n      typeof IntersectionObserver === \"undefined\"\n        ? undefined\n        : new IntersectionObserver((entries) => {\n            inView = entries.at(-1)?.isIntersecting ?? inView;\n            position();\n          });\n    visibility?.observe(anchor);\n    surface.addEventListener(\"focusin\", focusIn);\n    document.addEventListener(\"keydown\", keydown);\n    window.addEventListener(\"resize\", position);\n    window.addEventListener(\"scroll\", position, { capture: true, passive: true });\n    position();\n    onCleanup(() => {\n      observer?.disconnect();\n      visibility?.disconnect();\n      surface?.removeEventListener(\"focusin\", focusIn);\n      document.removeEventListener(\"keydown\", keydown);\n      window.removeEventListener(\"resize\", position);\n      window.removeEventListener(\"scroll\", position, true);\n      hide();\n    });\n  });\n\n  return (\n    <Show when={props.open}>\n      <div\n        ref={surface}\n        class={`k2b-moved-hint${props.class ? ` ${props.class}` : \"\"}`}\n        popover=\"manual\"\n        role=\"group\"\n        aria-labelledby={textId}\n        data-placement={props.placement ?? \"bottom\"}\n      >\n        <p ref={text} class=\"k2b-moved-hint__text\" id={textId}>\n          {props.children}\n        </p>\n        <div class=\"k2b-moved-hint__actions\">\n          <Show\n            when={props.action.href !== undefined}\n            fallback={\n              <Button\n                size=\"sm\"\n                variant=\"secondary\"\n                type=\"button\"\n                onClick={() => {\n                  const action = props.action;\n                  if (dismiss(false)) action.onClick?.();\n                }}\n              >\n                {props.action.label}\n              </Button>\n            }\n          >\n            <ButtonLink size=\"sm\" variant=\"secondary\" href={props.action.href} onClick={() => dismiss(false)}>\n              {props.action.label}\n            </ButtonLink>\n          </Show>\n          <Button size=\"sm\" variant=\"ghost\" type=\"button\" onClick={() => dismiss(true)}>\n            {messages().movedHintDismiss}\n          </Button>\n        </div>\n      </div>\n    </Show>\n  );\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/browser/feedback/dialog-core.js

@@ -58,6 +58,9 @@ const focusUnclaimed = dialog => {
   const active = document.activeElement;
   return !active || active === document.body || active === dialog;
 };
+
+/** Checked by shape: a test harness or an iframe may create the event in another realm. */
+const isPopState = value => typeof value === "object" && value !== null && "type" in value && value.type === "popstate" && "state" in value;
 export const createDialogCore = () => {
   const state = {
     stack: []
@@ -65,17 +68,26 @@ export const createDialogCore = () => {
   /** Markers of this core's entries in the browser history, oldest first. */
   let historyIds = [];
   const issued = new Set();
+  /**
+   * Markers forgotten during island disposal. Their entries stay in `historyIds` as barriers: a synthetic Back never
+   * crosses one, because the router may have replaced that entry with another page.
+   */
+  const forgotten = new Set();
+  const deadMarker = marker => typeof marker === "number" && forgotten.has(marker);
+  /** How often islands were disposed, so a dialog that waits to open notices that a content swap happened meanwhile. */
+  let disposals = 0;
   const ownMarker = marker => typeof marker === "number" && issued.has(marker);
   let seen;
   let traversalFrom;
   let syntheticFrom;
   const historyHolders = new Set();
   let historySyncScheduled = false;
+  let disposingIslands = false;
   /** Settles when the synthetic Back that removes closed dialogs' entries has arrived. */
   let returning;
   let resolveReturning;
 
-  /** Closed entries leave with one Back to the newest live dialog or holder, or to the page. */
+  /** Outside island disposal, closed entries leave with one Back to the newest live dialog or holder, or to the page. */
   const syncHistory = () => {
     if (returning) {
       void returning.then(() => {
@@ -87,7 +99,7 @@ export const createDialogCore = () => {
     const openIds = new Set([...state.stack, ...historyHolders].map(entry => entry.historyId));
     const current = historyIds.at(-1);
     let steps = 0;
-    while (historyIds.length > 0 && !openIds.has(historyIds.at(-1))) {
+    while (historyIds.length > 0 && !openIds.has(historyIds.at(-1)) && !deadMarker(historyIds.at(-1))) {
       historyIds.pop();
       steps++;
     }
@@ -107,13 +119,26 @@ export const createDialogCore = () => {
     history.go(-steps);
   };
   const releaseHistory = entry => {
-    if (entry.historyId === undefined || historySyncScheduled) return;
+    if (entry.historyId === undefined) return;
+    // During a content swap the router owns history. Forget the marker without moving history; its entry stays a
+    // barrier for later synthetic Backs and is left for the router to replace.
+    if (disposingIslands) {
+      issued.delete(entry.historyId);
+      forgotten.add(entry.historyId);
+      entry.historyId = undefined;
+      return;
+    }
+    if (historySyncScheduled) return;
     historySyncScheduled = true;
     queueMicrotask(syncHistory);
   };
 
+  /** Traversals this core already handled: a page swap router also reports the ones it hides from listeners. */
+  const handled = new WeakSet();
   /** Back or Forward moved to another entry: close dialogs and holders opened after the one it shows. */
   const onPopState = event => {
+    if (handled.has(event)) return;
+    handled.add(event);
     const resolveBack = resolveReturning;
     // Without the Navigation API, only our synthetic Back has a known departure.
     const from = typeof navigation !== "undefined" ? traversalFrom : resolveBack ? syntheticFrom : undefined;
@@ -126,8 +151,8 @@ export const createDialogCore = () => {
         event.stopImmediatePropagation();
       }
       // Own entries are ordered by id. A retired entry reached by Forward stays tracked, so closing the dialogs
-      // beneath it also removes it.
-      historyIds = ownMarker(marker) ? [...historyIds.filter(id => id < marker), marker] : [];
+      // beneath it also removes it. A forgotten entry keeps the holders opened before it and stays a barrier.
+      historyIds = ownMarker(marker) || deadMarker(marker) ? [...historyIds.filter(id => id < marker), marker] : [];
       const gone = entry => entry.historyId !== undefined && !historyIds.includes(entry.historyId);
       while (state.stack.some(gone)) popTop(undefined);
       for (const holder of [...historyHolders].reverse()) {
@@ -141,6 +166,36 @@ export const createDialogCore = () => {
       resolveBack?.();
     }
   };
+
+  /**
+   * Island disposal means the page content changes, as a document load would. Every dialog closes, top first, whichever
+   * code opened it: which island calls open() is not knowable after an await, in onMount or from a timer, and a modal
+   * left over the new content would block it.
+   */
+  const onIslandDispose = () => {
+    if (!disposingIslands) {
+      disposingIslands = true;
+      queueMicrotask(() => {
+        disposingIslands = false;
+      });
+      // Entries released just before, whose Back has not started yet, stay as well: the router owns history now.
+      // A Back already on its way still settles through `returning`.
+      historySyncScheduled = false;
+      const live = new Set([...state.stack, ...historyHolders].map(entry => entry.historyId));
+      for (const id of historyIds) {
+        if (live.has(id) || !issued.delete(id)) continue;
+        forgotten.add(id);
+      }
+    }
+    disposals++;
+    while (state.stack.length > 0) popTop(undefined);
+  };
+
+  /** `@k2b/ssr/nav` stops a traversal to another server page before later listeners and reports it here. */
+  const onHiddenPopState = event => {
+    const detail = "detail" in event ? event.detail : undefined;
+    if (isPopState(detail)) onPopState(detail);
+  };
   const onNavigate = event => {
     if (event.navigationType === "traverse") traversalFrom = {
       href: location.href,
@@ -154,10 +209,23 @@ export const createDialogCore = () => {
     listening?.window.removeEventListener("popstate", onPopState, {
       capture: true
     });
+    listening?.window.removeEventListener("ssr:nav-popstate", onHiddenPopState, {
+      capture: true
+    });
+    listening?.window.removeEventListener("ssr:island-dispose", onIslandDispose, {
+      capture: true
+    });
     listening?.navigation?.removeEventListener("navigate", onNavigate);
     window.addEventListener("popstate", onPopState, {
       capture: true
     });
+    window.addEventListener("ssr:nav-popstate", onHiddenPopState, {
+      capture: true
+    });
+    // Capture opens the disposal window before target listeners can release history holders.
+    window.addEventListener("ssr:island-dispose", onIslandDispose, {
+      capture: true
+    });
     const current = typeof navigation !== "undefined" ? navigation : undefined;
     current?.addEventListener("navigate", onNavigate);
     listening = {
@@ -206,7 +274,7 @@ export const createDialogCore = () => {
   };
 
   /**
-   * Settles once released entries have left the history. A caller that navigates or pushes an entry of its own waits
+   * Settles once released entries have left history or were forgotten during island disposal. A caller that navigates waits
    * for it, as a dialog's result waits: a Back still on its way would otherwise land behind the new entry.
    */
   const historySettled = async () => {
@@ -386,13 +454,19 @@ export const createDialogCore = () => {
     });
   };
   const open = (view, options = {}) => {
+    return openAfter(view, options, disposals);
+  };
+  const openAfter = (view, options, requested) => {
     if (options.signal?.aborted) return Promise.resolve(undefined);
     if (options.history) {
       // Dialogs closed just now leave the history first, or this dialog's entry would be the one removed.
       if (historySyncScheduled) syncHistory();
-      if (returning) return returning.then(() => open(view, options));
+      if (returning) return returning.then(() => openAfter(view, options, requested));
     }
+    // A dialog that waited for history while islands were disposed would open over content it was never meant for.
+    if (disposals !== requested) return Promise.resolve(undefined);
     const dialog = ensureDialogElement();
+    listen();
     const previousTop = state.stack[state.stack.length - 1];
     if (previousTop) previousTop.container.style.display = "none";
     const activeElement = document.activeElement;
@@ -427,11 +501,12 @@ export const createDialogCore = () => {
       };
       entry.resolve = value => {
         options.signal?.removeEventListener("abort", abort);
-        if (entry.historyId === undefined) {
+        if (!options.history) {
           resolve(value);
           return;
         }
         // After every pending history sync, so a caller that navigates or opens the next dialog finds the history settled.
+        // This holds for a marker forgotten during island disposal too, while an earlier synthetic Back is on its way.
         queueMicrotask(() => void historySettled().then(() => resolve(value)));
       };
       const closeTyped = result => {
@@ -522,8 +597,9 @@ export const dialogCore = publicDialogCore;
 /**
  * Internal: transient UI shares dialogs' Back handling without exposing another public dialog capability.
  * Same-URL traversals are suppressed with the Navigation API; without it, only the synthetic Back on release is suppressed.
+ * Release during island disposal forgets the marker without traversing; the router may replace the remaining entry.
  */
 export const holdDialogHistory = holdHistory;
-/** Internal: waits until entries released through `holdDialogHistory` have left the history. */
+/** Internal: waits until released holders have left history or were forgotten during island disposal. */
 export const dialogHistorySettled = historySettled;
 //# sourceMappingURL=dialog-core.js.map