@jsenv/navi 0.29.347 → 0.29.349
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/dev/jsenv_navi.js +44 -2
- package/dist/dev/jsenv_navi.js.map +3 -3
- package/dist/jsenv_navi.js +41 -2
- package/dist/jsenv_navi.js.map +3 -3
- package/docs/AI_INSTRUCTIONS.md +3 -1
- package/docs/popup_lift.md +120 -1
- package/docs/popup_open.md +7 -3
- package/package.json +1 -1
package/dist/dev/jsenv_navi.js
CHANGED
|
@@ -61249,6 +61249,15 @@ const css$E = /* css */`
|
|
|
61249
61249
|
* whatever triggered the open (`e.detail.source`). A string is resolved via
|
|
61250
61250
|
* `document.getElementById` when the dialog opens — see popover.jsx's own
|
|
61251
61251
|
* `anchor` doc for why (mainly `defaultOpen`).
|
|
61252
|
+
* @param {Element|{current: Element}|string} [props.liftAnchor] - Under
|
|
61253
|
+
* `animation="lifting"`, where the closing brings the box back to, when that
|
|
61254
|
+
* is no longer where it came from: a popup one walks through (a row of cards
|
|
61255
|
+
* shown one at a time) has something else in front by the time it closes,
|
|
61256
|
+
* and the box would otherwise fly back to the card the press opened on. Same
|
|
61257
|
+
* grammar as `anchor` (element, ref or id), resolved at the close, so
|
|
61258
|
+
* whatever names the card currently in front — an id built from the signal
|
|
61259
|
+
* the walk is bound to, a ref moved with it — is read then and not at the
|
|
61260
|
+
* opening. Left out, the box comes back to the anchor it came out of.
|
|
61252
61261
|
* @param {boolean} [props.sizeFromAnchor=false] - Whether the dialog takes the
|
|
61253
61262
|
* anchor's width/height as a min-width/min-height floor
|
|
61254
61263
|
* (`--anchor-width`/`--anchor-height`). Off by default: unlike a popover,
|
|
@@ -61584,6 +61593,10 @@ const useDialogProps = props => {
|
|
|
61584
61593
|
// Inert unless sizeFromAnchor below (see this file's top comment) —
|
|
61585
61594
|
// Dialog's own positioning is never relative to it.
|
|
61586
61595
|
anchor,
|
|
61596
|
+
// Where a lift comes back to, when that is no longer the box it came out
|
|
61597
|
+
// of. Read at the close, not kept from the opening — see
|
|
61598
|
+
// resolveLiftAnchorElement.
|
|
61599
|
+
liftAnchor,
|
|
61587
61600
|
// Opt-in: --anchor-width/--anchor-height are only set when this is true.
|
|
61588
61601
|
// See this prop's own JSDoc above for why a dialog does not follow its
|
|
61589
61602
|
// trigger's box by default.
|
|
@@ -61786,6 +61799,25 @@ const useDialogProps = props => {
|
|
|
61786
61799
|
return undefined;
|
|
61787
61800
|
};
|
|
61788
61801
|
|
|
61802
|
+
// A popup one walks through puts something else in front than what was
|
|
61803
|
+
// pressed — a row of cards shown one at a time, the walk carrying on from
|
|
61804
|
+
// the card the press opened on — and the box then has to come back to what
|
|
61805
|
+
// is in front NOW, which only the caller knows. Resolved at the close for
|
|
61806
|
+
// that reason: the element it names changes while the popup is open, so
|
|
61807
|
+
// anything read at the opening would be the walk's starting point again.
|
|
61808
|
+
const resolveLiftAnchorElement = () => {
|
|
61809
|
+
if (typeof liftAnchor === "string") {
|
|
61810
|
+
const liftAnchorElementById = document.getElementById(liftAnchor);
|
|
61811
|
+
if (!liftAnchorElementById) {
|
|
61812
|
+
console.warn(`Dialog: liftAnchor="${liftAnchor}" did not match any element`);
|
|
61813
|
+
}
|
|
61814
|
+
return liftAnchorElementById;
|
|
61815
|
+
}
|
|
61816
|
+
// A ref is unwrapped even when it holds nothing, the same way `anchor` is:
|
|
61817
|
+
// the ref object itself has no box to come back to.
|
|
61818
|
+
return "current" in liftAnchor ? liftAnchor.current : liftAnchor;
|
|
61819
|
+
};
|
|
61820
|
+
|
|
61789
61821
|
// The dialog and the anchor are the same box at two sizes, so the opening
|
|
61790
61822
|
// and the closing are one becoming the other. The browser draws that itself
|
|
61791
61823
|
// provided the change happens between its two pictures, which is what
|
|
@@ -61803,11 +61835,21 @@ const useDialogProps = props => {
|
|
|
61803
61835
|
applyChange();
|
|
61804
61836
|
return;
|
|
61805
61837
|
}
|
|
61806
|
-
|
|
61838
|
+
let anchorElement;
|
|
61839
|
+
if (opened) {
|
|
61840
|
+
anchorElement = resolveAnchorElement(event);
|
|
61841
|
+
} else if (liftAnchor) {
|
|
61842
|
+
anchorElement = resolveLiftAnchorElement();
|
|
61843
|
+
} else {
|
|
61844
|
+
anchorElement = anchorElementRef.current;
|
|
61845
|
+
}
|
|
61807
61846
|
if (!anchorElement) {
|
|
61808
61847
|
if (opened) {
|
|
61809
61848
|
console.warn(`[navi] Dialog has animation="lifting" and no anchor to lift out of, so it simply appears. The anchor is whatever opened it — a <Button command="--navi-open">, the "source" given to triggerNaviCommand — or the "anchor" prop.`);
|
|
61810
61849
|
}
|
|
61850
|
+
if (!opened && liftAnchor) {
|
|
61851
|
+
console.warn(`[navi] Dialog has animation="lifting" and a "liftAnchor" naming nothing on screen, so it simply closes. The element it names is where the box comes back to, and it has to be in the document at the close.`);
|
|
61852
|
+
}
|
|
61811
61853
|
applyChange();
|
|
61812
61854
|
return;
|
|
61813
61855
|
}
|
|
@@ -67850,7 +67892,7 @@ const css$x = /* css */`@layer navi {
|
|
|
67850
67892
|
}
|
|
67851
67893
|
|
|
67852
67894
|
.navi_list_failed_rows {
|
|
67853
|
-
height: var(--size-to-fill, 0px);
|
|
67895
|
+
min-height: var(--size-to-fill, 0px);
|
|
67854
67896
|
flex-shrink: 0;
|
|
67855
67897
|
list-style: none;
|
|
67856
67898
|
display: block;
|