@jsenv/navi 0.29.365 → 0.29.367
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 +270 -18
- package/dist/dev/jsenv_navi.js.map +5 -5
- package/dist/jsenv_navi.js +228 -18
- package/dist/jsenv_navi.js.map +5 -5
- package/docs/popup_lift.md +9 -0
- package/docs/popup_open.md +15 -2
- package/docs/route_transitions.md +61 -15
- package/package.json +1 -1
package/docs/popup_lift.md
CHANGED
|
@@ -245,6 +245,15 @@ bound to is the shortest way to say it, the row's tiles carrying the matching
|
|
|
245
245
|
ids. Left out, the box comes back where it came from, which is right exactly
|
|
246
246
|
as long as nothing walked.
|
|
247
247
|
|
|
248
|
+
When the walk signal is the address's — the popup's `signal`, so the sheet
|
|
249
|
+
comes back open on the same card after leaving the page (see
|
|
250
|
+
[popup_open.md](./popup_open.md#signal--the-app-holds-it-both-ways)) — a close
|
|
251
|
+
that comes through the address, the back button, empties it before the popup
|
|
252
|
+
knows it is closing, and a name built from it at that render says nothing:
|
|
253
|
+
the box flies home into the first tile. Name the tile from the last key the
|
|
254
|
+
walk held — a ref written while the signal holds one — not from the signal
|
|
255
|
+
itself.
|
|
256
|
+
|
|
248
257
|
**A press on the surface that dismisses is `data-navi-popup-outside`.** Marking
|
|
249
258
|
the see-through box as backdrop (see
|
|
250
259
|
[popup_backdrop.md](./popup_backdrop.md)) is read on the press itself. A close
|
package/docs/popup_open.md
CHANGED
|
@@ -875,6 +875,14 @@ the id from the signal, a card's press writes it, and the popup never writes
|
|
|
875
875
|
over it: opening writes `true` only into a signal that reads closed, closing
|
|
876
876
|
writes `undefined` (or `false`, where the signal held `true`).
|
|
877
877
|
|
|
878
|
+
When the popup is opened ON a card (`<Button command="--navi-open" value={id}>`),
|
|
879
|
+
`onOpen` is where the id is written: it runs before the popup writes its own
|
|
880
|
+
open, and a signal that already reads open is left as it is — the address holds
|
|
881
|
+
the card, never `true`. With the route's search-param `stateSignal` as the walk
|
|
882
|
+
signal, that is how [a row of
|
|
883
|
+
cards](./popup_lift.md#a-row-of-cards-one-popup-that-walks) survives leaving
|
|
884
|
+
the page: the address names the card, and the sheet reopens on it.
|
|
885
|
+
|
|
878
886
|
```jsx
|
|
879
887
|
<SidePanel signal={errorOpenSignal} side="right">
|
|
880
888
|
<ErrorPanel /> {/* reads errorOpenSignal.value to know which card */}
|
|
@@ -892,8 +900,13 @@ finds the popup as it was, and so does a reload. `true` stores it under the
|
|
|
892
900
|
popup's own `id`; a string names the key instead. `{ type: "push" }` makes the
|
|
893
901
|
opening an entry of its own — the back button then closes the popup rather than
|
|
894
902
|
leaving the screen, and the cancel takes back with it whatever was written to
|
|
895
|
-
the url while it was open. A `Picker` needs none of this: its
|
|
896
|
-
is nav state by construction
|
|
903
|
+
the url while it was open. A `Picker` given an `id` needs none of this: its
|
|
904
|
+
popup's open state is nav state by construction, under that id, and in dialog
|
|
905
|
+
mode the opening is an entry of its own. Without an `id` the key is a generated
|
|
906
|
+
one, which names one mount: the page left with the picker open and come back to
|
|
907
|
+
is a new mount with a new id, and the state stays in the entry with nothing to
|
|
908
|
+
read it — navi warns when a mount finds such a key. A picker whose popup leads
|
|
909
|
+
somewhere, a link inside it, has an `id`.
|
|
897
910
|
|
|
898
911
|
The two meet when the signal IS a route's: a search-param `stateSignal` given to
|
|
899
912
|
`signal` puts the open state in the address itself, where a link can point at
|
|
@@ -17,6 +17,7 @@ Demos: [the movements](../src/nav/demos/route_transition/route_transition.html),
|
|
|
17
17
|
- [Choosing a movement](#choosing-a-movement)
|
|
18
18
|
- [A default transition — when](#a-default-transition--when)
|
|
19
19
|
- [When one navigation knows better](#when-one-navigation-knows-better)
|
|
20
|
+
- [A traversal retraces its crossing](#a-traversal-retraces-its-crossing)
|
|
20
21
|
- [Pages between fixed bars: the transition area](#pages-between-fixed-bars-the-transition-area)
|
|
21
22
|
- [Custom movements](#custom-movements)
|
|
22
23
|
- [Two routes matching one url](#two-routes-matching-one-url)
|
|
@@ -62,13 +63,10 @@ Leave the `from` out:
|
|
|
62
63
|
defineRouteTransition(null, SETTINGS_PAGE, "cover-top");
|
|
63
64
|
```
|
|
64
65
|
|
|
65
|
-
Arriving there plays forward from wherever, leaving plays back to wherever.
|
|
66
|
-
back
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
the way in has no counterpart on the way out. Written on the destination, the way
|
|
70
|
-
out is found the same way the way in was, with nothing to remember per history
|
|
71
|
-
entry.
|
|
66
|
+
Arriving there plays forward from wherever, leaving plays back to wherever. A
|
|
67
|
+
back out of it retraces the crossing that opened it (see
|
|
68
|
+
[A traversal retraces its crossing](#a-traversal-retraces-its-crossing)); a link
|
|
69
|
+
out of it, to wherever, finds the relation the same way the way in did.
|
|
72
70
|
|
|
73
71
|
It is tried last, after every written pair, so a pair naming the same destination
|
|
74
72
|
still owns its crossing — the map, where it was drawn, is more precise than "from
|
|
@@ -151,8 +149,9 @@ in both directions, with one direction common and one rare:
|
|
|
151
149
|
out.
|
|
152
150
|
|
|
153
151
|
Written for the common direction, the rare one plays backwards. And `"none"`
|
|
154
|
-
cannot fix it:
|
|
155
|
-
|
|
152
|
+
cannot fix it: a relation written for a way holds for every crossing of it,
|
|
153
|
+
the back button's included (see below), so silencing the bad direction
|
|
154
|
+
silences the good one too.
|
|
156
155
|
|
|
157
156
|
So the navigation itself may ask, and what it asks holds for **that navigation
|
|
158
157
|
and no other**:
|
|
@@ -189,8 +188,9 @@ the routes say, and a link that asks for a movement gets it, forward unless it
|
|
|
189
188
|
says otherwise. That is the whole shape of the control:
|
|
190
189
|
`defineRouteTransition` is what the app's map says and applies by default; a
|
|
191
190
|
link, or a programmatic `navTo`, overrides it for the length of one navigation.
|
|
192
|
-
Navigate again by any other means and the relation is back in charge —
|
|
193
|
-
is
|
|
191
|
+
Navigate again by any other means and the relation is back in charge — with one
|
|
192
|
+
exception, which is what makes a request complete: a history traversal undoing
|
|
193
|
+
that navigation plays what it asked for, reversed (next section).
|
|
194
194
|
|
|
195
195
|
The link wears what it asks as an attribute, so a plain `<a>` says it too (a
|
|
196
196
|
type name, or the object as JSON):
|
|
@@ -203,10 +203,56 @@ type name, or the object as JSON):
|
|
|
203
203
|
|
|
204
204
|
**Not yet: a movement chosen by HOW one navigated.** Playing one movement for
|
|
205
205
|
the back button and another for a link would be written on the same request —
|
|
206
|
-
`{ back: "slide-x", forward: "slide-y" }
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
206
|
+
`{ back: "slide-x", forward: "slide-y" }`. The notation is kept in mind for the
|
|
207
|
+
day it is asked for.
|
|
208
|
+
|
|
209
|
+
## A traversal retraces its crossing
|
|
210
|
+
|
|
211
|
+
The back button, `navBack()`, `history.back()`, the browser's "next": a
|
|
212
|
+
traversal is not a walk on the map, it undoes one (or redoes one). The entry a
|
|
213
|
+
push creates remembers the crossing that created it — what played, which way,
|
|
214
|
+
from which url — in its own state. A back onto the page that crossing came
|
|
215
|
+
from plays it reversed; a forward onto an entry whose crossing came from the
|
|
216
|
+
page being left plays it again as it was.
|
|
217
|
+
|
|
218
|
+
That replay outranks everything the relations **deduce**, and nothing the
|
|
219
|
+
author **wrote** for that exact way:
|
|
220
|
+
|
|
221
|
+
| back from B to A | plays |
|
|
222
|
+
| ----------------------------------------------- | ----------------------------- |
|
|
223
|
+
| nothing written for `B → A` | the way in, reversed |
|
|
224
|
+
| `B → A` written from anywhere (`null → …`) | the way in, reversed |
|
|
225
|
+
| `B → A` covered by a default transition | the way in, reversed |
|
|
226
|
+
| the way in asked for by a link (`direction: …`) | what the link asked, reversed |
|
|
227
|
+
| `defineRouteTransition(B, A, "none")` | nothing |
|
|
228
|
+
| `defineRouteTransition(B, A, "flip")` | flip, forward |
|
|
229
|
+
|
|
230
|
+
The line is drawn there because the two halves answer two different needs.
|
|
231
|
+
Reciprocity is the default, and the one tool for breaking it is writing the
|
|
232
|
+
way back by hand — so that tool must reach the back button, which is the way
|
|
233
|
+
back most often taken: a `"none"` written for `B → A` silences every return
|
|
234
|
+
from B to A, whatever pressed it. Everything else `findRelation` answers is a
|
|
235
|
+
deduction from a sentence about something else (the reverse of a pair, a
|
|
236
|
+
destination reached from anywhere), and a traversal that knows the crossing it
|
|
237
|
+
undoes knows better than a deduction.
|
|
238
|
+
|
|
239
|
+
What this settles:
|
|
240
|
+
|
|
241
|
+
- a page reached from anywhere whose links walk the map the other way (the
|
|
242
|
+
author of a place's sheet, from the place): the link says
|
|
243
|
+
`routeTransition={{ direction: "forward" }}`, and the back undoes exactly
|
|
244
|
+
that — there is no reverse pair to write, and none that would collide with
|
|
245
|
+
the other pages reaching the place;
|
|
246
|
+
- a `routeTransition` request covers its own way back: a request is about one
|
|
247
|
+
crossing, so nothing written for the pair outranks its replay;
|
|
248
|
+
- the "two ways of a pair" trade-off above is about pairs written in one
|
|
249
|
+
direction: the reverse is deduced, and the traversal wins over it.
|
|
250
|
+
|
|
251
|
+
The relations alone answer a traversal that retraces no remembered crossing:
|
|
252
|
+
several entries at once, or an entry another document wrote. And a link to the
|
|
253
|
+
page one just came from is a traversal too where the browser exposes its stack
|
|
254
|
+
(navi turns such a push into a back, see `browser_integration/via_history.js`),
|
|
255
|
+
so it retraces as the button does — under the same rule.
|
|
210
256
|
|
|
211
257
|
## Pages between fixed bars: the transition area
|
|
212
258
|
|