@charcuterie/ui 3.7.0 → 3.8.1
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/VirtualizedGrid/VirtualizedGrid.d.ts +147 -0
- package/dist/VirtualizedGrid/VirtualizedGrid.d.ts.map +1 -0
- package/dist/VirtualizedGrid/VirtualizedGrid.js +177 -0
- package/dist/VirtualizedGrid/VirtualizedGrid.js.map +1 -0
- package/dist/VirtualizedGrid/gridGap.d.ts +20 -0
- package/dist/VirtualizedGrid/gridGap.d.ts.map +1 -0
- package/dist/VirtualizedGrid/gridGap.js +20 -0
- package/dist/VirtualizedGrid/gridGap.js.map +1 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
- package/src/VirtualizedGrid/VirtualizedGrid.mdx +110 -0
- package/src/VirtualizedGrid/VirtualizedGrid.stories.tsx +258 -0
- package/src/VirtualizedGrid/VirtualizedGrid.test.tsx +182 -0
- package/src/VirtualizedGrid/VirtualizedGrid.tsx +340 -0
- package/src/VirtualizedGrid/gridGap.ts +19 -0
- package/src/index.ts +3 -0
- package/src/sourceRules.test.ts +10 -1
|
@@ -0,0 +1,147 @@
|
|
|
1
|
+
import type { ReactNode } from "react";
|
|
2
|
+
import type { BlockSizeResolver } from "../AdaptiveGrid/useAdaptiveColumns.ts";
|
|
3
|
+
export type VirtualizedGridProps<Item> = {
|
|
4
|
+
/**
|
|
5
|
+
* Where the available block size is read from. Defaults to the
|
|
6
|
+
* viewport, which is the only thing that can answer "will this
|
|
7
|
+
* scroll".
|
|
8
|
+
*/
|
|
9
|
+
blockSizeResolver?: BlockSizeResolver;
|
|
10
|
+
/**
|
|
11
|
+
* Everything down the page that is not this grid, in CSS px —
|
|
12
|
+
* header, rails, filter rows. Subtracted before asking how many
|
|
13
|
+
* items stack.
|
|
14
|
+
*/
|
|
15
|
+
chromeBlockSize?: number;
|
|
16
|
+
className?: string;
|
|
17
|
+
/**
|
|
18
|
+
* Draw this many columns instead of the automatic answer — the
|
|
19
|
+
* manual override, for a page that hoisted `useAdaptiveColumns`
|
|
20
|
+
* itself.
|
|
21
|
+
*/
|
|
22
|
+
columns?: number;
|
|
23
|
+
/** The gap between tracks and rows, in CSS px. */
|
|
24
|
+
gap?: number;
|
|
25
|
+
/**
|
|
26
|
+
* A stable identity per item. Without one the key is the index,
|
|
27
|
+
* which is wrong the moment the list is filtered or an item
|
|
28
|
+
* leaves the middle — React reuses the mounted subtree and the
|
|
29
|
+
* wrong tile inherits the wrong open menu.
|
|
30
|
+
*/
|
|
31
|
+
getItemKey?: (item: Item, index: number) => string | number;
|
|
32
|
+
/**
|
|
33
|
+
* One row's block size in CSS px, as a starting guess.
|
|
34
|
+
*
|
|
35
|
+
* Unlike `AdaptiveGrid`'s, this is an *estimate* and not a
|
|
36
|
+
* commitment: every mounted row is measured and the estimate
|
|
37
|
+
* corrected. It still wants to be close, because it is what the
|
|
38
|
+
* scrollbar is sized from before anything has been measured — a
|
|
39
|
+
* bad guess makes the bar jump under the thumb on first scroll.
|
|
40
|
+
*/
|
|
41
|
+
itemBlockSize: number;
|
|
42
|
+
/** Every item, mounted or not. */
|
|
43
|
+
items: readonly Item[];
|
|
44
|
+
/**
|
|
45
|
+
* An accessible name for the list. Worth giving: a windowed list
|
|
46
|
+
* is one whose length a reader cannot count for itself.
|
|
47
|
+
*/
|
|
48
|
+
label?: string;
|
|
49
|
+
/** The most columns the automatic answer will take. */
|
|
50
|
+
maxColumns?: number;
|
|
51
|
+
/** The narrowest a column may be, in CSS px. */
|
|
52
|
+
minColumnInlineSize?: number;
|
|
53
|
+
/**
|
|
54
|
+
* How many rows to mount above and below the viewport.
|
|
55
|
+
*
|
|
56
|
+
* Four rather than `@tanstack/react-virtual`'s default of one:
|
|
57
|
+
* these are media tiles whose images load over the network, and
|
|
58
|
+
* a row that mounts at the moment it becomes visible shows a
|
|
59
|
+
* blank box while the image arrives. Overscan buys the load a
|
|
60
|
+
* head start.
|
|
61
|
+
*/
|
|
62
|
+
overscanRows?: number;
|
|
63
|
+
/** Draw one item. */
|
|
64
|
+
renderItem: (item: Item, index: number) => ReactNode;
|
|
65
|
+
/**
|
|
66
|
+
* The `localStorage` key a manual column choice is remembered
|
|
67
|
+
* under. Namespace it to the app; omit it and nothing is
|
|
68
|
+
* written.
|
|
69
|
+
*/
|
|
70
|
+
storageKey?: string;
|
|
71
|
+
};
|
|
72
|
+
/**
|
|
73
|
+
* `AdaptiveGrid`'s layout, with only the rows you can see mounted.
|
|
74
|
+
*
|
|
75
|
+
* The fleet's grids render every item they are given. That is the
|
|
76
|
+
* right default, and it stops being right somewhere in the low
|
|
77
|
+
* thousands: QueuePilot's Pending page put **2,162** tiles on one
|
|
78
|
+
* screen — 19,933 DOM nodes, 2,162 `<img>`, 4,371 `<button>`, 7.8
|
|
79
|
+
* seconds to settle, and roughly 43fps while scrolling on a machine
|
|
80
|
+
* with no GPU to lose. Nothing about that page was wrong except how
|
|
81
|
+
* much of it existed at once.
|
|
82
|
+
*
|
|
83
|
+
* ### It is the same grid, and deliberately so
|
|
84
|
+
*
|
|
85
|
+
* Columns come from `useAdaptiveColumns` — the identical
|
|
86
|
+
* height-first rule `AdaptiveGrid` uses, with the identical two-box
|
|
87
|
+
* structure protecting it (an uncapped outer box is measured, an
|
|
88
|
+
* inner box carries the cap). Windowing is the only difference. A
|
|
89
|
+
* second column heuristic that windowed lists followed and flow
|
|
90
|
+
* lists did not would be a fleet where the same content lays out
|
|
91
|
+
* two ways depending on how many of it there are.
|
|
92
|
+
*
|
|
93
|
+
* ### The window is padding, not absolute positioning
|
|
94
|
+
*
|
|
95
|
+
* The obvious build — absolutely position a row per visible row —
|
|
96
|
+
* is the one this does not do, and the reason is the markup. A
|
|
97
|
+
* `<ul>` whose children are positioning wrappers is not a list any
|
|
98
|
+
* more; the cards stop being `<li>`, and the structure a screen
|
|
99
|
+
* reader walks becomes a fiction maintained by ARIA roles.
|
|
100
|
+
*
|
|
101
|
+
* So there are no row elements at all. One real CSS grid holds the
|
|
102
|
+
* visible items as ordinary `<li>` children, and the thousands of
|
|
103
|
+
* rows above and below it are two numbers:
|
|
104
|
+
* `padding-block-start` for everything scrolled past and
|
|
105
|
+
* `padding-block-end` for everything still to come. The grid then
|
|
106
|
+
* does its own job — tracks on the inline axis, rows sized to
|
|
107
|
+
* their tallest item — instead of being reimplemented in
|
|
108
|
+
* `transform`s.
|
|
109
|
+
*
|
|
110
|
+
* ### How a row gets measured without existing
|
|
111
|
+
*
|
|
112
|
+
* A CSS grid stretches every cell in a row to the row's height
|
|
113
|
+
* (`align-items: stretch`, which is the default and is not
|
|
114
|
+
* overridden here). So **any** cell in a row is exactly as tall as
|
|
115
|
+
* the row, and measuring the first one measures the row. That is
|
|
116
|
+
* what `data-index` and the `measureElement` ref are doing on the
|
|
117
|
+
* leading cell of each row, and it is why tile heights are allowed
|
|
118
|
+
* to vary — a two-line title, a wrapped pair of buttons, a badge
|
|
119
|
+
* only some items carry.
|
|
120
|
+
*
|
|
121
|
+
* The row gap sits between two measured boxes and so is in
|
|
122
|
+
* neither. `measureRow` adds it back, which keeps the virtualizer's
|
|
123
|
+
* idea of the distance from one row to the next and the browser's
|
|
124
|
+
* the same number.
|
|
125
|
+
*
|
|
126
|
+
* ### Why the window and not a scroll box of its own
|
|
127
|
+
*
|
|
128
|
+
* `useWindowVirtualizer`, so the page scrolls the way every other
|
|
129
|
+
* page in the fleet scrolls — the header leaves, the scrollbar is
|
|
130
|
+
* the browser's, `Ctrl+End` works. A component that grew its own
|
|
131
|
+
* `overflow: auto` well would trap the wheel and strand the page
|
|
132
|
+
* header above it. The cost is `scrollMargin`: the virtualizer has
|
|
133
|
+
* to be told how far down the document the grid starts, which is
|
|
134
|
+
* measured below.
|
|
135
|
+
*
|
|
136
|
+
* ### What windowing costs, and what is done about it
|
|
137
|
+
*
|
|
138
|
+
* The true length is stated rather than implied — `aria-setsize` on
|
|
139
|
+
* every cell carries the full count and `aria-posinset` its real
|
|
140
|
+
* position, so a reader announces "3 of 2,162" instead of "3 of
|
|
141
|
+
* 40". Two costs have no fix at this layer and are the caller's to
|
|
142
|
+
* answer: the browser's `Ctrl+F` only searches what is mounted, and
|
|
143
|
+
* so does "select all". A page that needs either owes its users a
|
|
144
|
+
* search field of its own.
|
|
145
|
+
*/
|
|
146
|
+
export declare const VirtualizedGrid: <Item>({ blockSizeResolver, chromeBlockSize, className, columns, gap, getItemKey, itemBlockSize, items, label, maxColumns, minColumnInlineSize, overscanRows, renderItem, storageKey, }: VirtualizedGridProps<Item>) => ReactNode;
|
|
147
|
+
//# sourceMappingURL=VirtualizedGrid.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"VirtualizedGrid.d.ts","sourceRoot":"","sources":["../../src/VirtualizedGrid/VirtualizedGrid.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAStC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAA;AAK9E,MAAM,MAAM,oBAAoB,CAAC,IAAI,IAAI;IACvC;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,iBAAiB,CAAA;IACrC;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,kDAAkD;IAClD,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ;;;;;OAKG;IACH,UAAU,CAAC,EAAE,CACX,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,MAAM,KACV,MAAM,GAAG,MAAM,CAAA;IACpB;;;;;;;;OAQG;IACH,aAAa,EAAE,MAAM,CAAA;IACrB,kCAAkC;IAClC,KAAK,EAAE,SAAS,IAAI,EAAE,CAAA;IACtB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,uDAAuD;IACvD,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,gDAAgD;IAChD,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,qBAAqB;IACrB,UAAU,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAA;IACpD;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB,CAAA;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyEG;AACH,eAAO,MAAM,eAAe,GAAI,IAAI,EAAG,kLAepC,oBAAoB,CAAC,IAAI,CAAC,KAAG,SAkK/B,CAAA"}
|
|
@@ -0,0 +1,177 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useWindowVirtualizer } from "@tanstack/react-virtual";
|
|
3
|
+
import { useCallback, useLayoutEffect, useRef, useState, } from "react";
|
|
4
|
+
import { getContentMaxInlineSize } from "../AdaptiveGrid/chooseColumns.js";
|
|
5
|
+
import { useAdaptiveColumns } from "../AdaptiveGrid/useAdaptiveColumns.js";
|
|
6
|
+
import { toClassName } from "../toClassName.js";
|
|
7
|
+
import { DEFAULT_GRID_GAP_PX } from "./gridGap.js";
|
|
8
|
+
/**
|
|
9
|
+
* `AdaptiveGrid`'s layout, with only the rows you can see mounted.
|
|
10
|
+
*
|
|
11
|
+
* The fleet's grids render every item they are given. That is the
|
|
12
|
+
* right default, and it stops being right somewhere in the low
|
|
13
|
+
* thousands: QueuePilot's Pending page put **2,162** tiles on one
|
|
14
|
+
* screen — 19,933 DOM nodes, 2,162 `<img>`, 4,371 `<button>`, 7.8
|
|
15
|
+
* seconds to settle, and roughly 43fps while scrolling on a machine
|
|
16
|
+
* with no GPU to lose. Nothing about that page was wrong except how
|
|
17
|
+
* much of it existed at once.
|
|
18
|
+
*
|
|
19
|
+
* ### It is the same grid, and deliberately so
|
|
20
|
+
*
|
|
21
|
+
* Columns come from `useAdaptiveColumns` — the identical
|
|
22
|
+
* height-first rule `AdaptiveGrid` uses, with the identical two-box
|
|
23
|
+
* structure protecting it (an uncapped outer box is measured, an
|
|
24
|
+
* inner box carries the cap). Windowing is the only difference. A
|
|
25
|
+
* second column heuristic that windowed lists followed and flow
|
|
26
|
+
* lists did not would be a fleet where the same content lays out
|
|
27
|
+
* two ways depending on how many of it there are.
|
|
28
|
+
*
|
|
29
|
+
* ### The window is padding, not absolute positioning
|
|
30
|
+
*
|
|
31
|
+
* The obvious build — absolutely position a row per visible row —
|
|
32
|
+
* is the one this does not do, and the reason is the markup. A
|
|
33
|
+
* `<ul>` whose children are positioning wrappers is not a list any
|
|
34
|
+
* more; the cards stop being `<li>`, and the structure a screen
|
|
35
|
+
* reader walks becomes a fiction maintained by ARIA roles.
|
|
36
|
+
*
|
|
37
|
+
* So there are no row elements at all. One real CSS grid holds the
|
|
38
|
+
* visible items as ordinary `<li>` children, and the thousands of
|
|
39
|
+
* rows above and below it are two numbers:
|
|
40
|
+
* `padding-block-start` for everything scrolled past and
|
|
41
|
+
* `padding-block-end` for everything still to come. The grid then
|
|
42
|
+
* does its own job — tracks on the inline axis, rows sized to
|
|
43
|
+
* their tallest item — instead of being reimplemented in
|
|
44
|
+
* `transform`s.
|
|
45
|
+
*
|
|
46
|
+
* ### How a row gets measured without existing
|
|
47
|
+
*
|
|
48
|
+
* A CSS grid stretches every cell in a row to the row's height
|
|
49
|
+
* (`align-items: stretch`, which is the default and is not
|
|
50
|
+
* overridden here). So **any** cell in a row is exactly as tall as
|
|
51
|
+
* the row, and measuring the first one measures the row. That is
|
|
52
|
+
* what `data-index` and the `measureElement` ref are doing on the
|
|
53
|
+
* leading cell of each row, and it is why tile heights are allowed
|
|
54
|
+
* to vary — a two-line title, a wrapped pair of buttons, a badge
|
|
55
|
+
* only some items carry.
|
|
56
|
+
*
|
|
57
|
+
* The row gap sits between two measured boxes and so is in
|
|
58
|
+
* neither. `measureRow` adds it back, which keeps the virtualizer's
|
|
59
|
+
* idea of the distance from one row to the next and the browser's
|
|
60
|
+
* the same number.
|
|
61
|
+
*
|
|
62
|
+
* ### Why the window and not a scroll box of its own
|
|
63
|
+
*
|
|
64
|
+
* `useWindowVirtualizer`, so the page scrolls the way every other
|
|
65
|
+
* page in the fleet scrolls — the header leaves, the scrollbar is
|
|
66
|
+
* the browser's, `Ctrl+End` works. A component that grew its own
|
|
67
|
+
* `overflow: auto` well would trap the wheel and strand the page
|
|
68
|
+
* header above it. The cost is `scrollMargin`: the virtualizer has
|
|
69
|
+
* to be told how far down the document the grid starts, which is
|
|
70
|
+
* measured below.
|
|
71
|
+
*
|
|
72
|
+
* ### What windowing costs, and what is done about it
|
|
73
|
+
*
|
|
74
|
+
* The true length is stated rather than implied — `aria-setsize` on
|
|
75
|
+
* every cell carries the full count and `aria-posinset` its real
|
|
76
|
+
* position, so a reader announces "3 of 2,162" instead of "3 of
|
|
77
|
+
* 40". Two costs have no fix at this layer and are the caller's to
|
|
78
|
+
* answer: the browser's `Ctrl+F` only searches what is mounted, and
|
|
79
|
+
* so does "select all". A page that needs either owes its users a
|
|
80
|
+
* search field of its own.
|
|
81
|
+
*/
|
|
82
|
+
export const VirtualizedGrid = ({ blockSizeResolver, chromeBlockSize, className, columns, gap = DEFAULT_GRID_GAP_PX, getItemKey, itemBlockSize, items, label, maxColumns, minColumnInlineSize, overscanRows = 4, renderItem, storageKey, }) => {
|
|
83
|
+
const layout = useAdaptiveColumns({
|
|
84
|
+
blockSizeResolver,
|
|
85
|
+
chromeBlockSize,
|
|
86
|
+
itemBlockSize,
|
|
87
|
+
itemCount: items.length,
|
|
88
|
+
maxAutoColumns: maxColumns,
|
|
89
|
+
minColumnInlineSize,
|
|
90
|
+
storageKey,
|
|
91
|
+
});
|
|
92
|
+
const drawnColumns = columns ?? layout.columns;
|
|
93
|
+
// Folded from what is DRAWN rather than read off the hook, so an
|
|
94
|
+
// override widens the page cap with it — the same rule
|
|
95
|
+
// `AdaptiveGrid` follows, and wrong in the same way if it does
|
|
96
|
+
// not.
|
|
97
|
+
const contentMaxInlineSize = getContentMaxInlineSize({
|
|
98
|
+
columns: drawnColumns,
|
|
99
|
+
});
|
|
100
|
+
const rowCount = Math.ceil(items.length / drawnColumns);
|
|
101
|
+
/**
|
|
102
|
+
* How far down the document the grid starts.
|
|
103
|
+
*
|
|
104
|
+
* `useWindowVirtualizer` measures against the document, so
|
|
105
|
+
* without this every row is placed as though the grid began at
|
|
106
|
+
* the top of the page, and the whole list sits shifted by the
|
|
107
|
+
* height of the header above it.
|
|
108
|
+
*
|
|
109
|
+
* State and not a ref, because it feeds `scrollMargin` and a
|
|
110
|
+
* change has to re-render. Measured on every commit rather than
|
|
111
|
+
* on a dependency list: a filter row that grows a line moves the
|
|
112
|
+
* grid down the page, and nothing in this component's own props
|
|
113
|
+
* would report that.
|
|
114
|
+
*/
|
|
115
|
+
const gridElement = useRef(null);
|
|
116
|
+
const [scrollMargin, setScrollMargin] = useState(0);
|
|
117
|
+
useLayoutEffect(() => {
|
|
118
|
+
const element = gridElement.current;
|
|
119
|
+
if (!element) {
|
|
120
|
+
return;
|
|
121
|
+
}
|
|
122
|
+
const next = element.getBoundingClientRect().top + window.scrollY;
|
|
123
|
+
setScrollMargin((current) => current === next ? current : next);
|
|
124
|
+
});
|
|
125
|
+
/**
|
|
126
|
+
* A row's height, plus the gap that follows it.
|
|
127
|
+
*
|
|
128
|
+
* The gap is added here rather than left to the estimate because
|
|
129
|
+
* it is real distance the next row starts after: leave it out
|
|
130
|
+
* and the virtualizer's offsets drift by one gap per row, which
|
|
131
|
+
* on a list of two thousand is a scrollbar off by half a page.
|
|
132
|
+
*/
|
|
133
|
+
const measureRow = useCallback((element) => element.getBoundingClientRect().height + gap, [gap]);
|
|
134
|
+
const rowVirtualizer = useWindowVirtualizer({
|
|
135
|
+
count: rowCount,
|
|
136
|
+
estimateSize: () => itemBlockSize + gap,
|
|
137
|
+
measureElement: measureRow,
|
|
138
|
+
overscan: overscanRows,
|
|
139
|
+
scrollMargin,
|
|
140
|
+
});
|
|
141
|
+
const virtualRows = rowVirtualizer.getVirtualItems();
|
|
142
|
+
const firstRow = virtualRows[0];
|
|
143
|
+
const lastRow = virtualRows[virtualRows.length - 1];
|
|
144
|
+
// Everything scrolled past, and everything still to come. The two
|
|
145
|
+
// numbers that stand in for the rows that do not exist.
|
|
146
|
+
const paddingBlockStart = firstRow?.start ?? 0;
|
|
147
|
+
const paddingBlockEnd = lastRow
|
|
148
|
+
? Math.max(0, rowVirtualizer.getTotalSize() - lastRow.end)
|
|
149
|
+
: 0;
|
|
150
|
+
return (_jsx("div", { className: toClassName("flex justify-center", className), ref: layout.containerRef, children: _jsx("ul", { "aria-label": label, className: "grid w-full list-none p-0 [&>*]:min-w-0", ref: gridElement, style: {
|
|
151
|
+
gap: `${gap}px`,
|
|
152
|
+
gridTemplateColumns: `repeat(${drawnColumns}, minmax(0, 1fr))`,
|
|
153
|
+
maxInlineSize: contentMaxInlineSize,
|
|
154
|
+
// Offset by `scrollMargin` because `start` is measured
|
|
155
|
+
// from the top of the document, and this padding is
|
|
156
|
+
// measured from the top of the grid.
|
|
157
|
+
paddingBlockEnd: `${paddingBlockEnd}px`,
|
|
158
|
+
paddingBlockStart: `${Math.max(0, paddingBlockStart - scrollMargin)}px`,
|
|
159
|
+
}, children: virtualRows.flatMap((row) => {
|
|
160
|
+
const firstIndex = row.index * drawnColumns;
|
|
161
|
+
return items
|
|
162
|
+
.slice(firstIndex, firstIndex + drawnColumns)
|
|
163
|
+
.map((item, offset) => {
|
|
164
|
+
const index = firstIndex + offset;
|
|
165
|
+
return (_jsx("li", { "aria-posinset": index + 1, "aria-setsize": items.length, "data-index": row.index,
|
|
166
|
+
// Measured on the leading cell alone. A CSS grid
|
|
167
|
+
// stretches every cell to its row's height, so
|
|
168
|
+
// one is enough — and measuring all of them
|
|
169
|
+
// would have the virtualizer record the same row
|
|
170
|
+
// once per column.
|
|
171
|
+
ref: offset === 0
|
|
172
|
+
? rowVirtualizer.measureElement
|
|
173
|
+
: undefined, children: renderItem(item, index) }, getItemKey?.(item, index) ?? index));
|
|
174
|
+
});
|
|
175
|
+
}) }) }));
|
|
176
|
+
};
|
|
177
|
+
//# sourceMappingURL=VirtualizedGrid.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"VirtualizedGrid.js","sourceRoot":"","sources":["../../src/VirtualizedGrid/VirtualizedGrid.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* The gap between tracks and between rows in a wrapping grid, in
|
|
3
|
+
* CSS px.
|
|
4
|
+
*
|
|
5
|
+
* `AdaptiveGrid` spells this `gap-4` and never has to know the
|
|
6
|
+
* number: it lays out in flow, so the browser owns the spacing.
|
|
7
|
+
* `VirtualizedGrid` does have to know it. The space between two
|
|
8
|
+
* rows falls outside the box either of them measures, and the rows
|
|
9
|
+
* above and below the window are arithmetic rather than layout, so
|
|
10
|
+
* a gap the component cannot name is a gap its scrollbar is wrong
|
|
11
|
+
* by — once per row, which on a list of two thousand is half a
|
|
12
|
+
* page.
|
|
13
|
+
*
|
|
14
|
+
* `4` on Tailwind's spacing scale is `1rem`, and `1rem` is 16px at
|
|
15
|
+
* the fleet's root size. Exported so a caller measuring its own
|
|
16
|
+
* `itemBlockSize` off a running page can account for it rather
|
|
17
|
+
* than rediscovering the number.
|
|
18
|
+
*/
|
|
19
|
+
export declare const DEFAULT_GRID_GAP_PX = 16;
|
|
20
|
+
//# sourceMappingURL=gridGap.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"gridGap.d.ts","sourceRoot":"","sources":["../../src/VirtualizedGrid/gridGap.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,mBAAmB,KAAK,CAAA"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* The gap between tracks and between rows in a wrapping grid, in
|
|
3
|
+
* CSS px.
|
|
4
|
+
*
|
|
5
|
+
* `AdaptiveGrid` spells this `gap-4` and never has to know the
|
|
6
|
+
* number: it lays out in flow, so the browser owns the spacing.
|
|
7
|
+
* `VirtualizedGrid` does have to know it. The space between two
|
|
8
|
+
* rows falls outside the box either of them measures, and the rows
|
|
9
|
+
* above and below the window are arithmetic rather than layout, so
|
|
10
|
+
* a gap the component cannot name is a gap its scrollbar is wrong
|
|
11
|
+
* by — once per row, which on a list of two thousand is half a
|
|
12
|
+
* page.
|
|
13
|
+
*
|
|
14
|
+
* `4` on Tailwind's spacing scale is `1rem`, and `1rem` is 16px at
|
|
15
|
+
* the fleet's root size. Exported so a caller measuring its own
|
|
16
|
+
* `itemBlockSize` off a running page can account for it rather
|
|
17
|
+
* than rediscovering the number.
|
|
18
|
+
*/
|
|
19
|
+
export const DEFAULT_GRID_GAP_PX = 16;
|
|
20
|
+
//# sourceMappingURL=gridGap.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"gridGap.js","sourceRoot":"","sources":["../../src/VirtualizedGrid/gridGap.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,EAAE,CAAA"}
|
package/dist/index.d.ts
CHANGED
|
@@ -170,6 +170,9 @@ export { Toolbar } from "./Toolbar/Toolbar.tsx";
|
|
|
170
170
|
export type { TooltipProps } from "./Tooltip/Tooltip.tsx";
|
|
171
171
|
export { Tooltip } from "./Tooltip/Tooltip.tsx";
|
|
172
172
|
export { toClassName } from "./toClassName.ts";
|
|
173
|
+
export { DEFAULT_GRID_GAP_PX } from "./VirtualizedGrid/gridGap.ts";
|
|
174
|
+
export type { VirtualizedGridProps } from "./VirtualizedGrid/VirtualizedGrid.tsx";
|
|
175
|
+
export { VirtualizedGrid } from "./VirtualizedGrid/VirtualizedGrid.tsx";
|
|
173
176
|
export type { VisuallyHiddenProps } from "./VisuallyHidden/VisuallyHidden.tsx";
|
|
174
177
|
export { VisuallyHidden } from "./VisuallyHidden/VisuallyHidden.tsx";
|
|
175
178
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AAEH,YAAY,EACV,qBAAqB,EACrB,aAAa,EACb,cAAc,GACf,MAAM,2BAA2B,CAAA;AAClC,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AACrD,YAAY,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAA;AACxE,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAA;AAC9D,YAAY,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAA;AACnE,OAAO,EACL,aAAa,EACb,wBAAwB,EACxB,0BAA0B,EAC1B,iCAAiC,EACjC,gBAAgB,EAChB,uBAAuB,GACxB,MAAM,iCAAiC,CAAA;AACxC,YAAY,EACV,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,sCAAsC,CAAA;AAC7C,OAAO,EACL,6BAA6B,EAC7B,gBAAgB,EAChB,kBAAkB,EAClB,yBAAyB,GAC1B,MAAM,sCAAsC,CAAA;AAC7C,YAAY,EACV,UAAU,EACV,SAAS,GACV,MAAM,mBAAmB,CAAA;AAC1B,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,YAAY,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,YAAY,EACV,SAAS,EACT,UAAU,GACX,MAAM,mBAAmB,CAAA;AAC1B,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,YAAY,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAA;AACtD,YAAY,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AAC1D,YAAY,EACV,aAAa,EACb,eAAe,EACf,UAAU,EACV,SAAS,GACV,MAAM,sBAAsB,CAAA;AAC7B,OAAO,EACL,eAAe,EACf,gBAAgB,EAChB,YAAY,EACZ,mBAAmB,EACnB,cAAc,GACf,MAAM,sBAAsB,CAAA;AAC7B,YAAY,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,YAAY,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAA;AAClE,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAA;AACxD,YAAY,EACV,WAAW,EACX,SAAS,EACT,WAAW,GACZ,MAAM,iBAAiB,CAAA;AACxB,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAA;AACtC,YAAY,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAA;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAA;AAClD,YAAY,EAAE,wBAAwB,EAAE,MAAM,+CAA+C,CAAA;AAC7F,OAAO,EAAE,mBAAmB,EAAE,MAAM,+CAA+C,CAAA;AACnF,YAAY,EACV,gBAAgB,EAChB,sBAAsB,GACvB,MAAM,2CAA2C,CAAA;AAClD,OAAO,EAAE,iBAAiB,EAAE,MAAM,2CAA2C,CAAA;AAC7E,YAAY,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAA;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAA;AAClD,OAAO,EACL,4BAA4B,EAC5B,yBAAyB,EACzB,uBAAuB,EACvB,4BAA4B,GAC7B,MAAM,wBAAwB,CAAA;AAC/B,YAAY,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AACnD,OAAO,EACL,gBAAgB,EAChB,kBAAkB,EAClB,kBAAkB,EAClB,cAAc,EACd,mBAAmB,EACnB,uBAAuB,EACvB,sBAAsB,EACtB,kBAAkB,GACnB,MAAM,oBAAoB,CAAA;AAC3B,YAAY,EACV,eAAe,EACf,cAAc,EACd,kBAAkB,EAClB,aAAa,GACd,MAAM,2BAA2B,CAAA;AAClC,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AACrD,YAAY,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAA;AAClE,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAA;AACxD,YAAY,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAA;AAC7D,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAA;AAClE,YAAY,EACV,iBAAiB,EACjB,eAAe,EACf,qBAAqB,GACtB,MAAM,gCAAgC,CAAA;AACvC,OAAO,EACL,2BAA2B,EAC3B,cAAc,GACf,MAAM,gCAAgC,CAAA;AACvC,YAAY,EACV,SAAS,EACT,SAAS,EACT,sBAAsB,GACvB,MAAM,2BAA2B,CAAA;AAClC,OAAO,EACL,OAAO,EACP,SAAS,EACT,cAAc,EACd,iBAAiB,EACjB,eAAe,EACf,YAAY,EACZ,cAAc,EACd,cAAc,EACd,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,mBAAmB,EACnB,gBAAgB,EAChB,iBAAiB,EACjB,aAAa,EACb,yBAAyB,EACzB,UAAU,EACV,eAAe,EACf,YAAY,EACZ,SAAS,GACV,MAAM,2BAA2B,CAAA;AAClC,YAAY,EACV,WAAW,EACX,UAAU,GACX,MAAM,qBAAqB,CAAA;AAC5B,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,YAAY,EACV,eAAe,EACf,cAAc,GACf,MAAM,6BAA6B,CAAA;AACpC,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAA;AACxD,YAAY,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,YAAY,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAC7D,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAA;AACnD,YAAY,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAA;AACxE,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAA;AAC9D,YAAY,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,YAAY,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAA;AAClE,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAA;AACxD,YAAY,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAA;AACzD,OAAO,EACL,mBAAmB,EACnB,cAAc,EACd,gBAAgB,EAChB,uBAAuB,EACvB,oBAAoB,EACpB,kBAAkB,EAClB,uBAAuB,GACxB,MAAM,mBAAmB,CAAA;AAC1B,YAAY,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAA;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAA;AAClD,YAAY,EACV,WAAW,EACX,YAAY,GACb,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,YAAY,EACV,wBAAwB,EACxB,uBAAuB,GACxB,MAAM,+CAA+C,CAAA;AACtD,OAAO,EAAE,mBAAmB,EAAE,MAAM,+CAA+C,CAAA;AACnF,YAAY,EACV,OAAO,EACP,cAAc,GACf,MAAM,2BAA2B,CAAA;AAClC,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AACrD,YAAY,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAChD,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAA;AACtC,YAAY,EACV,mBAAmB,EACnB,mBAAmB,GACpB,MAAM,qCAAqC,CAAA;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAA;AACpE,OAAO,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAA;AACtE,YAAY,EACV,YAAY,EACZ,gBAAgB,EAChB,YAAY,EACZ,gBAAgB,GACjB,MAAM,mCAAmC,CAAA;AAC1C,OAAO,EACL,WAAW,EACX,eAAe,GAChB,MAAM,mCAAmC,CAAA;AAC1C,YAAY,EACV,cAAc,EACd,cAAc,GACf,MAAM,2BAA2B,CAAA;AAClC,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AACrD,YAAY,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAA;AAC7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAA;AAC7D,YAAY,EACV,QAAQ,EACR,SAAS,GACV,MAAM,iBAAiB,CAAA;AACxB,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAA;AACtC,YAAY,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,YAAY,EACV,YAAY,EACZ,WAAW,GACZ,MAAM,qBAAqB,CAAA;AAC5B,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,YAAY,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,YAAY,EACV,gBAAgB,EAChB,eAAe,GAChB,MAAM,+BAA+B,CAAA;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAC3D,YAAY,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AACvE,OAAO,EACL,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,GAChB,MAAM,gCAAgC,CAAA;AACvC,YAAY,EACV,kBAAkB,EAClB,iBAAiB,GAClB,MAAM,iCAAiC,CAAA;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAA;AAC9D,YAAY,EACV,eAAe,EACf,SAAS,GACV,MAAM,6BAA6B,CAAA;AACpC,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAA;AACxD,YAAY,EACV,YAAY,EACZ,SAAS,EACT,QAAQ,GACT,MAAM,iBAAiB,CAAA;AACxB,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAA;AACtC,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAA;AACxD,OAAO,EACL,kBAAkB,EAClB,aAAa,GACd,MAAM,qCAAqC,CAAA;AAC5C,YAAY,EACV,mBAAmB,EACnB,eAAe,GAChB,MAAM,4BAA4B,CAAA;AACnC,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAA;AAC5D,YAAY,EACV,qBAAqB,EACrB,aAAa,GACd,MAAM,yCAAyC,CAAA;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,yCAAyC,CAAA;AAM1E,YAAY,EACV,UAAU,EACV,YAAY,EACZ,iBAAiB,EACjB,WAAW,GACZ,MAAM,qBAAqB,CAAA;AAC5B,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,YAAY,EACV,YAAY,EACZ,UAAU,GACX,MAAM,yBAAyB,CAAA;AAChC,YAAY,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,YAAY,EACV,aAAa,EACb,aAAa,GACd,MAAM,yBAAyB,CAAA;AAChC,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAA;AAClD,YAAY,EACV,wBAAwB,EACxB,aAAa,GACd,MAAM,+CAA+C,CAAA;AACtD,OAAO,EAAE,mBAAmB,EAAE,MAAM,+CAA+C,CAAA;AACnF,YAAY,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,YAAY,EACV,IAAI,EACJ,kBAAkB,EAClB,YAAY,EACZ,UAAU,GACX,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,YAAY,EACV,gBAAgB,EAChB,WAAW,EACX,UAAU,GACX,MAAM,qBAAqB,CAAA;AAC5B,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,YAAY,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,YAAY,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAC/C,OAAO,EACL,cAAc,EACd,aAAa,EACb,mBAAmB,EACnB,kBAAkB,EAClB,mBAAmB,GACpB,MAAM,mBAAmB,CAAA;AAC1B,YAAY,EACV,OAAO,EACP,cAAc,EACd,eAAe,EACf,SAAS,GACV,MAAM,iBAAiB,CAAA;AACxB,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAA;AACtC,YAAY,EACV,kBAAkB,EAClB,aAAa,GACd,MAAM,yBAAyB,CAAA;AAChC,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAA;AAClD,YAAY,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,YAAY,EACV,WAAW,EACX,gBAAgB,GACjB,MAAM,yBAAyB,CAAA;AAChC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAA;AACrD,YAAY,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAA;AACpE,YAAY,EACV,aAAa,EACb,cAAc,EACd,WAAW,EACX,YAAY,GACb,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,YAAY,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAC9C,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAA;AAClE,YAAY,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAA;AACjF,OAAO,EAAE,eAAe,EAAE,MAAM,uCAAuC,CAAA;AACvE,YAAY,EAAE,mBAAmB,EAAE,MAAM,qCAAqC,CAAA;AAC9E,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAA"}
|
package/dist/index.js
CHANGED
|
@@ -102,5 +102,7 @@ export { chooseVisibleCount } from "./Toolbar/chooseVisibleCount.js";
|
|
|
102
102
|
export { Toolbar } from "./Toolbar/Toolbar.js";
|
|
103
103
|
export { Tooltip } from "./Tooltip/Tooltip.js";
|
|
104
104
|
export { toClassName } from "./toClassName.js";
|
|
105
|
+
export { DEFAULT_GRID_GAP_PX } from "./VirtualizedGrid/gridGap.js";
|
|
106
|
+
export { VirtualizedGrid } from "./VirtualizedGrid/VirtualizedGrid.js";
|
|
105
107
|
export { VisuallyHidden } from "./VisuallyHidden/VisuallyHidden.js";
|
|
106
108
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@charcuterie/ui",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.8.1",
|
|
4
4
|
"description": "The Charcuterie components. Tokens for look, @charcuterie/logic for state, ARIA that agents can actually drive.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
"typecheck": "tsc --noEmit"
|
|
54
54
|
},
|
|
55
55
|
"dependencies": {
|
|
56
|
-
"@charcuterie/logic": "2.
|
|
56
|
+
"@charcuterie/logic": "2.1.0",
|
|
57
57
|
"@charcuterie/tokens": "1.6.0",
|
|
58
58
|
"@floating-ui/react": "^0.27.20",
|
|
59
59
|
"@tanstack/react-virtual": "^3.13.12",
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
import { Canvas, Controls, Meta } from "@storybook/addon-docs/blocks";
|
|
2
|
+
|
|
3
|
+
import * as VirtualizedGridStories from "./VirtualizedGrid.stories";
|
|
4
|
+
|
|
5
|
+
<Meta of={VirtualizedGridStories} />
|
|
6
|
+
|
|
7
|
+
# VirtualizedGrid
|
|
8
|
+
|
|
9
|
+
**`AdaptiveGrid`, with only the rows you can see mounted.** Same column rule, same
|
|
10
|
+
two-box structure, same content cap. The one difference is that a list of 2,000 costs
|
|
11
|
+
about as much as a list of 40.
|
|
12
|
+
|
|
13
|
+
<Canvas of={VirtualizedGridStories.Default} />
|
|
14
|
+
|
|
15
|
+
## Props
|
|
16
|
+
|
|
17
|
+
<Controls />
|
|
18
|
+
|
|
19
|
+
## When to reach for it
|
|
20
|
+
|
|
21
|
+
Not by default. `AdaptiveGrid` renders everything it is handed, and that is the right
|
|
22
|
+
behaviour: the DOM is searchable with `Ctrl+F`, `Ctrl+End` goes where you expect, and
|
|
23
|
+
nothing has to be measured. Reach for this one when the item count is genuinely
|
|
24
|
+
unbounded — a library listing, an inbox, a backlog that grows.
|
|
25
|
+
|
|
26
|
+
The number that prompted it, measured on QueuePilot's Pending page:
|
|
27
|
+
|
|
28
|
+
| | Every item rendered |
|
|
29
|
+
| --- | --- |
|
|
30
|
+
| Items | 2,162 |
|
|
31
|
+
| DOM nodes | 19,933 |
|
|
32
|
+
| `<img>` elements | 2,162 |
|
|
33
|
+
| `<button>` elements | 4,371 |
|
|
34
|
+
| Time to settle | 7.8 s |
|
|
35
|
+
| Scroll rate | ~43 fps |
|
|
36
|
+
|
|
37
|
+
Nothing about that page was wrong except how much of it existed at once.
|
|
38
|
+
|
|
39
|
+
## Rows are the unit
|
|
40
|
+
|
|
41
|
+
The virtualizer counts **rows**, not items. An item-level virtualizer would have to place
|
|
42
|
+
every item on both axes; a row-level one gets the inline axis from CSS grid for free and
|
|
43
|
+
only ever answers "how far down".
|
|
44
|
+
|
|
45
|
+
So `itemBlockSize` is a row-height estimate, and unlike `AdaptiveGrid`'s it is not a
|
|
46
|
+
commitment — every mounted row is measured and the estimate corrected. It still wants to
|
|
47
|
+
be close, because it is what the scrollbar is sized from before anything has been
|
|
48
|
+
measured. A bad guess makes the bar jump under the thumb on the first scroll.
|
|
49
|
+
|
|
50
|
+
## It scrolls the page, not a box of its own
|
|
51
|
+
|
|
52
|
+
`useWindowVirtualizer`, so the page scrolls the way every other page in the fleet
|
|
53
|
+
scrolls — the header leaves, the scrollbar is the browser's, `Ctrl+End` works. A
|
|
54
|
+
component that grew its own `overflow: auto` well would trap the wheel and strand the
|
|
55
|
+
page header above it.
|
|
56
|
+
|
|
57
|
+
The cost is that the grid has to know how far down the document it starts, which it
|
|
58
|
+
measures in a layout effect and feeds to the virtualizer as `scrollMargin`. Get that
|
|
59
|
+
wrong and every row is offset by the height of the header above it.
|
|
60
|
+
|
|
61
|
+
## The column rule is inherited, not reimplemented
|
|
62
|
+
|
|
63
|
+
<Canvas of={VirtualizedGridStories.AllVariants} />
|
|
64
|
+
|
|
65
|
+
Columns come from `useAdaptiveColumns` — the identical hook `AdaptiveGrid` calls. The
|
|
66
|
+
consequence that reads backwards holds here too: a **taller** window takes **fewer**
|
|
67
|
+
columns, because height is what a column is bought with.
|
|
68
|
+
|
|
69
|
+
This is deliberate. A second column heuristic that windowed lists followed and flow lists
|
|
70
|
+
did not would be a fleet where the same content lays out two ways depending on how many
|
|
71
|
+
of it there are.
|
|
72
|
+
|
|
73
|
+
## The states that are easy to miss
|
|
74
|
+
|
|
75
|
+
<Canvas of={VirtualizedGridStories.AllStates} />
|
|
76
|
+
|
|
77
|
+
An empty list draws a zero-height box and no rows — a windowed grid must not reserve
|
|
78
|
+
space for a list that is not there, and it is the state a filter lands on. One item is
|
|
79
|
+
one column, the same answer `AdaptiveGrid` gives.
|
|
80
|
+
|
|
81
|
+
## It is still read from the container
|
|
82
|
+
|
|
83
|
+
<Canvas of={VirtualizedGridStories.Responsive} />
|
|
84
|
+
|
|
85
|
+
The browser never moves and the column count still falls. Inline size comes off a
|
|
86
|
+
`ResizeObserver` on the container, so a grid beside a rail gets the room it actually has
|
|
87
|
+
rather than the room the window claims.
|
|
88
|
+
|
|
89
|
+
## Accessibility
|
|
90
|
+
|
|
91
|
+
A mounted window is a lie about length, so the true length is stated rather than implied:
|
|
92
|
+
|
|
93
|
+
- `role="list"` on the grid, with the `label` prop as its accessible name.
|
|
94
|
+
- `aria-setsize` on every cell, carrying the **full** item count.
|
|
95
|
+
- `aria-posinset` naming each cell's real position in that full list.
|
|
96
|
+
- `role="presentation"` on the row wrappers — they are a positioning device and have no
|
|
97
|
+
business appearing in the structure.
|
|
98
|
+
|
|
99
|
+
Without `aria-setsize` a screen reader announces "list, 40 items" on a list of 2,000.
|
|
100
|
+
|
|
101
|
+
Two things windowing genuinely costs, and neither has a fix at this layer: the browser's
|
|
102
|
+
`Ctrl+F` only searches what is mounted, and so does "select all". A page that needs
|
|
103
|
+
either owes its users a search field of its own.
|
|
104
|
+
|
|
105
|
+
## `getItemKey`
|
|
106
|
+
|
|
107
|
+
Pass one. Without it the key is the array index, which is wrong the moment the list is
|
|
108
|
+
filtered or an item is removed from the middle — React reuses the mounted subtree and the
|
|
109
|
+
wrong tile inherits the wrong open menu. That is not hypothetical; it is what a
|
|
110
|
+
dismiss-an-item list does on every interaction.
|