@broberg/app-shell 0.20.1 → 0.21.0

package/README.md

@@ -176,6 +176,9 @@ const [open, setOpen] = useState(false);
 testids: `<prefix>-menu`, `<prefix>-action-<id>`, `<prefix>-back`, `<prefix>-input`, `<prefix>-save` — so the
 anchor's own testid must not be `<prefix>-menu`.
 
+**0.21.0** — `placement: "up-start"` (F092.31): above the anchor, left edge = the anchor's left edge (clamped
+8px inside the viewport); below if there is no room above. For a «+» in a composer. `auto`/`down` unchanged.
+
 ## 0.11.1 — the palette list floats over the menu (F001.25)
 
 Christian 10/10: «Kunne denne ikke være en pop-over ting så dialogen ikke bliver

package/dist/preact.cjs

@@ -579,9 +579,12 @@ function ItemActionsMenu(props) {
     const vw = window.innerWidth, vh = window.innerHeight, m = 8;
     const w = Math.min(240, vw - 2 * m);
     const h = menu.current?.offsetHeight ?? 0;
-    const left = Math.max(m, Math.min(r.right - w, vw - w - m));
+    const start = props.placement === "up-start";
+    const left = Math.max(m, Math.min(start ? r.left : r.right - w, vw - w - m));
     const fitsBelow = r.bottom + 4 + h <= vh - m;
-    const top = props.placement === "down" || fitsBelow || r.top - 4 - h < m ? Math.min(r.bottom + 4, vh - m - h) : r.top - 4 - h;
+    const fitsAbove = r.top - 4 - h >= m;
+    const below = start ? !fitsAbove : props.placement === "down" || fitsBelow || !fitsAbove;
+    const top = below ? Math.min(r.bottom + 4, vh - m - h) : r.top - 4 - h;
     setPos({ position: "fixed", left: `${left}px`, top: `${Math.max(m, top)}px`, width: `${w}px` });
   }, [stack.length]);
   hooks.useLayoutEffect(() => {