@jsenv/navi 0.30.3 → 0.30.5
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 +205 -36
- package/dist/dev/jsenv_navi.js.map +12 -12
- package/dist/jsenv_navi.js +205 -36
- package/dist/jsenv_navi.js.map +12 -12
- package/docs/drag_to_travel.md +3 -1
- package/docs/navigation.md +50 -0
- package/docs/scroll.md +8 -0
- package/package.json +1 -1
package/docs/drag_to_travel.md
CHANGED
|
@@ -235,7 +235,9 @@ A row of screens is a scroll container, and contains itself.
|
|
|
235
235
|
|
|
236
236
|
A `RouteTravel` page not visited yet can only be built by the address moving, since
|
|
237
237
|
a route's actions ask only while it matches. So the address moves once the hand has
|
|
238
|
-
really pulled, 16px, and the page fills in under the finger.
|
|
238
|
+
really pulled, 16px, and the page fills in under the finger. Before that its pane
|
|
239
|
+
is empty and the box's background shows, unless `renderNeighbour` says what stands
|
|
240
|
+
there. See
|
|
239
241
|
[navigation.md](./navigation.md#tabs-that-travel-routetravel).
|
|
240
242
|
|
|
241
243
|
Both tell what follows them how far the row has come. `SlideContainer` writes
|
package/docs/navigation.md
CHANGED
|
@@ -569,6 +569,29 @@ given again around the page on screen as the reader moves through the list: it i
|
|
|
569
569
|
taken once the row has come to rest, and nothing is seen moving for it. With fewer
|
|
570
570
|
than two pages, the box is not a scroller at all.
|
|
571
571
|
|
|
572
|
+
**A neighbour not there yet is empty until the hand has pulled**, a page of a window
|
|
573
|
+
or a tab never visited, and it is the box's background one sees there.
|
|
574
|
+
`renderNeighbour` says what stands in its place: the page's background, its
|
|
575
|
+
skeleton, the name the list already holds.
|
|
576
|
+
|
|
577
|
+
```jsx
|
|
578
|
+
<RouteTravel
|
|
579
|
+
routes={players.map(({ id, name }) => ({
|
|
580
|
+
route: PLAYER_ROUTE,
|
|
581
|
+
params: { id },
|
|
582
|
+
name,
|
|
583
|
+
}))}
|
|
584
|
+
renderNeighbour={(page) => <PlayerSkeleton name={page.name} />}
|
|
585
|
+
>
|
|
586
|
+
<PlayerPage />
|
|
587
|
+
</RouteTravel>
|
|
588
|
+
```
|
|
589
|
+
|
|
590
|
+
It stands on each side of the page on screen, already painted when a finger lands,
|
|
591
|
+
since the browser moves the row whatever the main thread is doing. So it renders
|
|
592
|
+
with the page, and is worth keeping light. It is not the page: its route does not
|
|
593
|
+
match yet, so it asks for nothing.
|
|
594
|
+
|
|
572
595
|
**The box has a height, or the document scrolls.** Pages may scroll themselves in a
|
|
573
596
|
box the page gives a height to. If the document is what scrolls, it goes on doing
|
|
574
597
|
so, and a page brought in stands where the reader is looking; what is lost is
|
|
@@ -1063,6 +1086,33 @@ is shown. A popup's `value` answers another one, WHICH of several popups is open
|
|
|
1063
1086
|
(one sheet per card under a single `?seat=<gameId>`), not what varies inside one
|
|
1064
1087
|
(see [popup_open.md](./popup_open.md#signal--the-app-holds-it-both-ways)).
|
|
1065
1088
|
|
|
1089
|
+
**What a tab reads is asked for while the layer is open, not while the tab is
|
|
1090
|
+
shown.** Under a hand the signal is only written once the row has landed, and a
|
|
1091
|
+
neighbour is on screen from the first pixel. So a read whose params depend on the
|
|
1092
|
+
signal asks after the travel, and its slide travels without it. `mount="near"` keeps
|
|
1093
|
+
the slide built, not what it reads. Ask from the opening, and let the slide read its
|
|
1094
|
+
question, as
|
|
1095
|
+
[a popup that loads data](./popup_open.md#a-popup-that-loads-data) does:
|
|
1096
|
+
|
|
1097
|
+
```js
|
|
1098
|
+
// asked while the layer is open, whichever tab is on screen
|
|
1099
|
+
export const LINKED_ACCOUNTS = routeAction(ANY_PAGE, ACCOUNT.GET_MANY, () => {
|
|
1100
|
+
return settingsSignal.value;
|
|
1101
|
+
});
|
|
1102
|
+
// read by the slide, on screen, sliding away, or with the layer closing
|
|
1103
|
+
export const LINKED_ACCOUNTS_SHOWN = ACCOUNT.GET_MANY.bindParams(true);
|
|
1104
|
+
```
|
|
1105
|
+
|
|
1106
|
+
Read through the route action, a slide loses its data as soon as there is
|
|
1107
|
+
[nothing to ask](./actions.md#nothing-to-ask-and-coming-back): while the layer
|
|
1108
|
+
closes, or as soon as the tab is left if the params follow it. The question standing,
|
|
1109
|
+
reopening finds the answer and sends nothing, unless the action's `keep` says that
|
|
1110
|
+
answer is too old.
|
|
1111
|
+
|
|
1112
|
+
The cost is one request per read at each first opening, for tabs that may never be
|
|
1113
|
+
looked at. navi does not tell an application which slides a hand can bring in, so a
|
|
1114
|
+
row too heavy to ask for everything has no finer answer than this.
|
|
1115
|
+
|
|
1066
1116
|
### A link inside the layer leads to a page
|
|
1067
1117
|
|
|
1068
1118
|
The terms of use behind an About dialog, a profile behind a name in the
|
package/docs/scroll.md
CHANGED
|
@@ -254,6 +254,14 @@ list warns in dev when the second is missing:
|
|
|
254
254
|
A row selected during the search does not hold the view: emptying the search
|
|
255
255
|
takes the list back to where it was, which may be nowhere near that row.
|
|
256
256
|
|
|
257
|
+
The offset is given back once, in the frame after the search empties, and then
|
|
258
|
+
forgotten. A list under a `display: none` at that moment cannot scroll, so it has
|
|
259
|
+
nowhere to put it: shown again, it stands at its start, and the `navi_scroll` of
|
|
260
|
+
that restore carries no `item`. It does not wait to be shown, because the user
|
|
261
|
+
may have moved on by then, and an old offset would surprise them more than the
|
|
262
|
+
start of the list. A list that is only out of view still gets its offset back. To
|
|
263
|
+
keep the place across a hide, empty the search once the list is shown again.
|
|
264
|
+
|
|
257
265
|
### Loading: two different situations
|
|
258
266
|
|
|
259
267
|
`loading` (with `loadingFallback`, `loadingSkeletonCount`, `renderSkeleton`)
|