@jsenv/navi 0.29.495 → 0.29.497

package/dist/jsenv_navi.js

@@ -78993,12 +78993,14 @@ const PickerCustomResolver = props => {
     return renderResolver(PickerNative, props);
   }
   if (props.mode === "callout") {
-    // A tooltip is an icon one presses, unless told otherwise. Own-property
-    // rather than undefined: an explicit variant={undefined} asks for the
-    // field-like drawing back. "circle" is the icon variant with the status
-    // icon drawn round — a word about the trigger, not a drawing of its own.
-    if (!Object.hasOwn(props, "variant")) {
+    // A tooltip is an icon one presses, unless told otherwise; "picker" asks
+    // for the field-like drawing back. "circle" is the icon variant with the
+    // status icon drawn round — a word about the trigger, not a drawing of its
+    // own.
+    if (props.variant === undefined) {
       props.variant = "icon";
+    } else if (props.variant === "picker") {
+      props.variant = undefined;
     }
     const circle = props.variant === "circle";
     if (circle) {
@@ -80489,11 +80491,10 @@ const PickerConfirmResolver = props => {
     openWhileReadOnly = false
   } = props;
   // A button, unless told otherwise: nothing is picked here, the popup is a
-  // question, and a question is asked by pressing something. "picker" — or an
-  // explicit `variant={undefined}` — is how a caller asks for the field-like
-  // drawing back; a destructuring default could not tell that from nothing
-  // being said.
-  const variant = Object.hasOwn(props, "variant") ? props.variant === "picker" ? undefined : props.variant : "button";
+  // question, and a question is asked by pressing something. "picker" is how a
+  // caller asks for the field-like drawing back — a word, not an undefined, so
+  // a wrapper forwarding `variant={variant}` keeps the button.
+  const variant = props.variant === undefined ? "button" : props.variant === "picker" ? undefined : props.variant;
 
   // From the picker's own input, as its press would have been: the input is
   // what carries `command`/`commandFor` in the DOM, and what a form sending
@@ -84871,19 +84872,28 @@ const useListScrollSync = ({
     });
   }, []);
   // What to do when the list's own geometry moves under it, kept fresh for the
-  // observer below (which is installed once).
+  // observer below (which is installed once). A held list is placed inside the
+  // resize delivery, so the browser paints it where it lands; answers whether
+  // it was.
   const onGeometryChangeRef = useRef(null);
   onGeometryChangeRef.current = () => {
-    settleWindow();
-    if (heldSomewhere) {
-      placeWhereHeld();
-      return true;
+    if (!heldSomewhere) {
+      return false;
     }
-    // Items that came in at another size than what stood in for them (a
-    // skeleton becoming its item) leave the window short of the screen, or past
-    // it, and nothing scrolled to say so.
+    settleWindow();
+    placeWhereHeld();
+    return true;
+  };
+  // Items that came in at another size than what stood in for them (a
+  // skeleton becoming its item) leave the window short of the screen, or past
+  // it, and nothing scrolled to say so. Asked on the next frame, not inside
+  // the resize delivery: the window it frames is a render, which resizes what
+  // is observed once more, and the browser gives up on the loop
+  // ("ResizeObserver loop completed with undelivered notifications").
+  const onItemsResizedRef = useRef(null);
+  onItemsResizedRef.current = () => {
+    settleWindow();
     evaluateWindowRef.current("items resized");
-    return false;
   };
   // The box around a held list changing shape is the hold's to answer too: it
   // places the list again, the way it writes every scroll of its own (see
@@ -85031,10 +85041,20 @@ const useListScrollSync = ({
     // which this would undo. The SCROLLER resizing is the window around it
     // changing shape, and then the item that was at the top goes back where it
     // was.
+    let itemsResizedFrame;
     const putTopItemBack = entries => {
       const listResized = entries.some(entry => entry.target === listEl);
-      if (listResized && onGeometryChangeRef.current()) {
-        return;
+      if (listResized) {
+        if (onGeometryChangeRef.current()) {
+          return;
+        }
+        cancelAnimationFrame(itemsResizedFrame);
+        itemsResizedFrame = requestAnimationFrame(() => {
+          if (pageLeftRef.current) {
+            return;
+          }
+          onItemsResizedRef.current();
+        });
       }
       if (!entries.some(entry => entry.target === scrollerEl)) {
         return;
@@ -85087,6 +85107,7 @@ const useListScrollSync = ({
     observer.observe(listEl);
     return () => {
       observer.disconnect();
+      cancelAnimationFrame(itemsResizedFrame);
     };
   }, [scrollerElResolved]);
 
@@ -92884,9 +92905,8 @@ const PickerUI = /*#__PURE__*/Object.assign(PickerDefaultUI, {
  *   not sit in — an object on a map saying
  *   `triggerNaviCommand(pickerEl, "--navi-open", event, { anchor, value })` —
  *   therefore wants an element of its own to stretch into rather than the
- *   nearest positioned ancestor it happens to find. `"picker"` (or an explicit
- *   `variant={undefined}`) asks a confirm or callout picker for the field-like
- *   drawing every other picker has.
+ *   nearest positioned ancestor it happens to find. `"picker"` asks a confirm
+ *   or callout picker for the field-like drawing every other picker has.
  * @param {boolean} [cta] A call to action: filled with the accent, its border
  *   matching, as `cta` draws a Button — for a confirm picker that is a row's
  *   main action.