@oddsquad/vite-plugin-lit 0.3.0 → 0.4.0
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/CHANGELOG.md +48 -0
- package/README.md +10 -6
- package/dist/client/assets/{browser-agent-rpc-BXhoSh1z-BvWe4sTJ.js → browser-agent-rpc-BXhoSh1z-CdtPhBL-.js} +2 -2
- package/dist/client/assets/{browser-agent-rpc-BXhoSh1z-BvWe4sTJ.js.map → browser-agent-rpc-BXhoSh1z-CdtPhBL-.js.map} +1 -1
- package/dist/client/assets/flow-DK8vmxvN.js +745 -0
- package/dist/client/assets/flow-DK8vmxvN.js.map +1 -0
- package/dist/client/assets/{index-CFrVgNfS.js → index-DVe6M4HV.js} +976 -102
- package/dist/client/assets/index-DVe6M4HV.js.map +1 -0
- package/dist/client/index.html +1 -1
- package/lib/devframe/protocol.d.ts.map +1 -1
- package/lib/devframe/protocol.js +1 -0
- package/lib/devframe/protocol.js.map +1 -1
- package/lib/devframe/vite.d.ts.map +1 -1
- package/lib/devframe/vite.js +1 -0
- package/lib/devframe/vite.js.map +1 -1
- package/lib/options.d.ts +131 -0
- package/lib/options.d.ts.map +1 -0
- package/lib/options.js +128 -0
- package/lib/options.js.map +1 -0
- package/lib/plugin.d.ts +6 -148
- package/lib/plugin.d.ts.map +1 -1
- package/lib/plugin.js +14 -477
- package/lib/plugin.js.map +1 -1
- package/lib/plugins/css-literals.d.ts +15 -0
- package/lib/plugins/css-literals.d.ts.map +1 -0
- package/lib/plugins/css-literals.js +154 -0
- package/lib/plugins/css-literals.js.map +1 -0
- package/lib/plugins/css-queries.d.ts +20 -0
- package/lib/plugins/css-queries.d.ts.map +1 -0
- package/lib/plugins/css-queries.js +139 -0
- package/lib/plugins/css-queries.js.map +1 -0
- package/lib/plugins/open-in-editor.d.ts +16 -0
- package/lib/plugins/open-in-editor.d.ts.map +1 -0
- package/lib/plugins/open-in-editor.js +91 -0
- package/lib/plugins/open-in-editor.js.map +1 -0
- package/lib/plugins/shared.d.ts +13 -0
- package/lib/plugins/shared.d.ts.map +1 -0
- package/lib/plugins/shared.js +23 -0
- package/lib/plugins/shared.js.map +1 -0
- package/lib/plugins/timeline-virtual.d.ts +19 -0
- package/lib/plugins/timeline-virtual.d.ts.map +1 -0
- package/lib/plugins/timeline-virtual.js +53 -0
- package/lib/plugins/timeline-virtual.js.map +1 -0
- package/lib/runtime/css.d.ts.map +1 -1
- package/lib/runtime/css.js +9 -2
- package/lib/runtime/css.js.map +1 -1
- package/lib/runtime/inspector/install.js +61 -11
- package/lib/runtime/inspector/install.js.map +1 -1
- package/lib/runtime/source-overlay/overlay-element.d.ts.map +1 -1
- package/lib/runtime/source-overlay/overlay-element.js +19 -6
- package/lib/runtime/source-overlay/overlay-element.js.map +1 -1
- package/lib/runtime/timeline/install.js +10 -5
- package/lib/runtime/timeline/install.js.map +1 -1
- package/lib/runtime/timeline/public-api.d.ts +2 -2
- package/lib/runtime/timeline/public-api.js +2 -2
- package/lib/runtime/timeline/public-api.js.map +1 -1
- package/lib/runtime/timeline/render.d.ts +15 -6
- package/lib/runtime/timeline/render.d.ts.map +1 -1
- package/lib/runtime/timeline/render.js +150 -11
- package/lib/runtime/timeline/render.js.map +1 -1
- package/package.json +4 -1
- package/types/timeline.d.ts +12 -1
- package/types/timeline.d.ts.map +1 -1
- package/types/timeline.js +2 -0
- package/types/timeline.js.map +1 -1
- package/dist/client/assets/index-CFrVgNfS.js.map +0 -1
- package/lib/timeline-plugin.d.ts +0 -72
- package/lib/timeline-plugin.d.ts.map +0 -1
- package/lib/timeline-plugin.js +0 -359
- package/lib/timeline-plugin.js.map +0 -1
|
@@ -0,0 +1,745 @@
|
|
|
1
|
+
//#region node_modules/.pnpm/@lit-labs+virtualizer@2.1.1/node_modules/@lit-labs/virtualizer/layouts/shared/SizeCache.js
|
|
2
|
+
/**
|
|
3
|
+
* @license
|
|
4
|
+
* Copyright 2021 Google LLC
|
|
5
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
6
|
+
*/
|
|
7
|
+
var SizeCache = class {
|
|
8
|
+
constructor(config) {
|
|
9
|
+
this._map = /* @__PURE__ */ new Map();
|
|
10
|
+
this._roundAverageSize = false;
|
|
11
|
+
this.totalSize = 0;
|
|
12
|
+
if (config?.roundAverageSize === true) this._roundAverageSize = true;
|
|
13
|
+
}
|
|
14
|
+
set(index, value) {
|
|
15
|
+
const prev = this._map.get(index) || 0;
|
|
16
|
+
this._map.set(index, value);
|
|
17
|
+
this.totalSize += value - prev;
|
|
18
|
+
}
|
|
19
|
+
get averageSize() {
|
|
20
|
+
if (this._map.size > 0) {
|
|
21
|
+
const average = this.totalSize / this._map.size;
|
|
22
|
+
return this._roundAverageSize ? Math.round(average) : average;
|
|
23
|
+
}
|
|
24
|
+
return 0;
|
|
25
|
+
}
|
|
26
|
+
getSize(index) {
|
|
27
|
+
return this._map.get(index);
|
|
28
|
+
}
|
|
29
|
+
clear() {
|
|
30
|
+
this._map.clear();
|
|
31
|
+
this.totalSize = 0;
|
|
32
|
+
}
|
|
33
|
+
};
|
|
34
|
+
//#endregion
|
|
35
|
+
//#region node_modules/.pnpm/@lit-labs+virtualizer@2.1.1/node_modules/@lit-labs/virtualizer/layouts/shared/BaseLayout.js
|
|
36
|
+
/**
|
|
37
|
+
* @license
|
|
38
|
+
* Copyright 2021 Google LLC
|
|
39
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
40
|
+
*/
|
|
41
|
+
function dim1(direction) {
|
|
42
|
+
return direction === "horizontal" ? "width" : "height";
|
|
43
|
+
}
|
|
44
|
+
var BaseLayout = class {
|
|
45
|
+
_getDefaultConfig() {
|
|
46
|
+
return { direction: "vertical" };
|
|
47
|
+
}
|
|
48
|
+
constructor(hostSink, config) {
|
|
49
|
+
/**
|
|
50
|
+
* The last set viewport scroll position.
|
|
51
|
+
*/
|
|
52
|
+
this._latestCoords = {
|
|
53
|
+
left: 0,
|
|
54
|
+
top: 0
|
|
55
|
+
};
|
|
56
|
+
/**
|
|
57
|
+
* Scrolling direction.
|
|
58
|
+
*/
|
|
59
|
+
this._direction = null;
|
|
60
|
+
/**
|
|
61
|
+
* Dimensions of the viewport.
|
|
62
|
+
*/
|
|
63
|
+
this._viewportSize = {
|
|
64
|
+
width: 0,
|
|
65
|
+
height: 0
|
|
66
|
+
};
|
|
67
|
+
this.totalScrollSize = {
|
|
68
|
+
width: 0,
|
|
69
|
+
height: 0
|
|
70
|
+
};
|
|
71
|
+
this.offsetWithinScroller = {
|
|
72
|
+
left: 0,
|
|
73
|
+
top: 0
|
|
74
|
+
};
|
|
75
|
+
/**
|
|
76
|
+
* Flag for debouncing asynchronous reflow requests.
|
|
77
|
+
*/
|
|
78
|
+
this._pendingReflow = false;
|
|
79
|
+
this._pendingLayoutUpdate = false;
|
|
80
|
+
this._pin = null;
|
|
81
|
+
/**
|
|
82
|
+
* The index of the first item intersecting the viewport.
|
|
83
|
+
*/
|
|
84
|
+
this._firstVisible = 0;
|
|
85
|
+
/**
|
|
86
|
+
* The index of the last item intersecting the viewport.
|
|
87
|
+
*/
|
|
88
|
+
this._lastVisible = 0;
|
|
89
|
+
/**
|
|
90
|
+
* Pixel offset in the scroll direction of the first child.
|
|
91
|
+
*/
|
|
92
|
+
this._physicalMin = 0;
|
|
93
|
+
/**
|
|
94
|
+
* Pixel offset in the scroll direction of the last child.
|
|
95
|
+
*/
|
|
96
|
+
this._physicalMax = 0;
|
|
97
|
+
/**
|
|
98
|
+
* Index of the first child.
|
|
99
|
+
*/
|
|
100
|
+
this._first = -1;
|
|
101
|
+
/**
|
|
102
|
+
* Index of the last child.
|
|
103
|
+
*/
|
|
104
|
+
this._last = -1;
|
|
105
|
+
/**
|
|
106
|
+
* Length in the scrolling direction.
|
|
107
|
+
*/
|
|
108
|
+
this._sizeDim = "height";
|
|
109
|
+
/**
|
|
110
|
+
* Length in the non-scrolling direction.
|
|
111
|
+
*/
|
|
112
|
+
this._secondarySizeDim = "width";
|
|
113
|
+
/**
|
|
114
|
+
* Position in the scrolling direction.
|
|
115
|
+
*/
|
|
116
|
+
this._positionDim = "top";
|
|
117
|
+
/**
|
|
118
|
+
* Position in the non-scrolling direction.
|
|
119
|
+
*/
|
|
120
|
+
this._secondaryPositionDim = "left";
|
|
121
|
+
/**
|
|
122
|
+
* Current scroll offset in pixels.
|
|
123
|
+
*/
|
|
124
|
+
this._scrollPosition = 0;
|
|
125
|
+
/**
|
|
126
|
+
* Difference between current scroll offset and scroll offset calculated due
|
|
127
|
+
* to a reflow.
|
|
128
|
+
*/
|
|
129
|
+
this._scrollError = 0;
|
|
130
|
+
/**
|
|
131
|
+
* Total number of items that could possibly be displayed. Used to help
|
|
132
|
+
* calculate the scroll size.
|
|
133
|
+
*/
|
|
134
|
+
this._items = [];
|
|
135
|
+
/**
|
|
136
|
+
* The total (estimated) length of all items in the scrolling direction.
|
|
137
|
+
*/
|
|
138
|
+
this._scrollSize = 1;
|
|
139
|
+
/**
|
|
140
|
+
* Number of pixels beyond the viewport to still include
|
|
141
|
+
* in the active range of items.
|
|
142
|
+
*/
|
|
143
|
+
this._overhang = 1e3;
|
|
144
|
+
this._hostSink = hostSink;
|
|
145
|
+
Promise.resolve().then(() => this.config = config || this._getDefaultConfig());
|
|
146
|
+
}
|
|
147
|
+
set config(config) {
|
|
148
|
+
Object.assign(this, Object.assign({}, this._getDefaultConfig(), config));
|
|
149
|
+
}
|
|
150
|
+
get config() {
|
|
151
|
+
return { direction: this.direction };
|
|
152
|
+
}
|
|
153
|
+
/**
|
|
154
|
+
* Maximum index of children + 1, to help estimate total height of the scroll
|
|
155
|
+
* space.
|
|
156
|
+
*/
|
|
157
|
+
get items() {
|
|
158
|
+
return this._items;
|
|
159
|
+
}
|
|
160
|
+
set items(items) {
|
|
161
|
+
this._setItems(items);
|
|
162
|
+
}
|
|
163
|
+
_setItems(items) {
|
|
164
|
+
if (items !== this._items) {
|
|
165
|
+
this._items = items;
|
|
166
|
+
this._scheduleReflow();
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
/**
|
|
170
|
+
* Primary scrolling direction.
|
|
171
|
+
*/
|
|
172
|
+
get direction() {
|
|
173
|
+
return this._direction;
|
|
174
|
+
}
|
|
175
|
+
set direction(dir) {
|
|
176
|
+
dir = dir === "horizontal" ? dir : "vertical";
|
|
177
|
+
if (dir !== this._direction) {
|
|
178
|
+
this._direction = dir;
|
|
179
|
+
this._sizeDim = dir === "horizontal" ? "width" : "height";
|
|
180
|
+
this._secondarySizeDim = dir === "horizontal" ? "height" : "width";
|
|
181
|
+
this._positionDim = dir === "horizontal" ? "left" : "top";
|
|
182
|
+
this._secondaryPositionDim = dir === "horizontal" ? "top" : "left";
|
|
183
|
+
this._triggerReflow();
|
|
184
|
+
}
|
|
185
|
+
}
|
|
186
|
+
/**
|
|
187
|
+
* Height and width of the viewport.
|
|
188
|
+
*/
|
|
189
|
+
get viewportSize() {
|
|
190
|
+
return this._viewportSize;
|
|
191
|
+
}
|
|
192
|
+
set viewportSize(dims) {
|
|
193
|
+
const { _viewDim1, _viewDim2 } = this;
|
|
194
|
+
Object.assign(this._viewportSize, dims);
|
|
195
|
+
if (_viewDim2 !== this._viewDim2) this._scheduleLayoutUpdate();
|
|
196
|
+
else if (_viewDim1 !== this._viewDim1) this._checkThresholds();
|
|
197
|
+
}
|
|
198
|
+
/**
|
|
199
|
+
* Scroll offset of the viewport.
|
|
200
|
+
*/
|
|
201
|
+
get viewportScroll() {
|
|
202
|
+
return this._latestCoords;
|
|
203
|
+
}
|
|
204
|
+
set viewportScroll(coords) {
|
|
205
|
+
Object.assign(this._latestCoords, coords);
|
|
206
|
+
const oldPos = this._scrollPosition;
|
|
207
|
+
this._scrollPosition = this._latestCoords[this._positionDim];
|
|
208
|
+
if (Math.abs(oldPos - this._scrollPosition) >= 1) this._checkThresholds();
|
|
209
|
+
}
|
|
210
|
+
/**
|
|
211
|
+
* Perform a reflow if one has been scheduled.
|
|
212
|
+
*/
|
|
213
|
+
reflowIfNeeded(force = false) {
|
|
214
|
+
if (force || this._pendingReflow) {
|
|
215
|
+
this._pendingReflow = false;
|
|
216
|
+
this._reflow();
|
|
217
|
+
}
|
|
218
|
+
}
|
|
219
|
+
set pin(options) {
|
|
220
|
+
this._pin = options;
|
|
221
|
+
this._triggerReflow();
|
|
222
|
+
}
|
|
223
|
+
get pin() {
|
|
224
|
+
if (this._pin !== null) {
|
|
225
|
+
const { index, block } = this._pin;
|
|
226
|
+
return {
|
|
227
|
+
index: Math.max(0, Math.min(index, this.items.length - 1)),
|
|
228
|
+
block
|
|
229
|
+
};
|
|
230
|
+
}
|
|
231
|
+
return null;
|
|
232
|
+
}
|
|
233
|
+
_clampScrollPosition(val) {
|
|
234
|
+
return Math.max(-this.offsetWithinScroller[this._positionDim], Math.min(val, this.totalScrollSize[dim1(this.direction)] - this._viewDim1));
|
|
235
|
+
}
|
|
236
|
+
unpin() {
|
|
237
|
+
if (this._pin !== null) {
|
|
238
|
+
this._sendUnpinnedMessage();
|
|
239
|
+
this._pin = null;
|
|
240
|
+
}
|
|
241
|
+
}
|
|
242
|
+
_updateLayout() {}
|
|
243
|
+
/**
|
|
244
|
+
* The height or width of the viewport, whichever corresponds to the scrolling direction.
|
|
245
|
+
*/
|
|
246
|
+
get _viewDim1() {
|
|
247
|
+
return this._viewportSize[this._sizeDim];
|
|
248
|
+
}
|
|
249
|
+
/**
|
|
250
|
+
* The height or width of the viewport, whichever does NOT correspond to the scrolling direction.
|
|
251
|
+
*/
|
|
252
|
+
get _viewDim2() {
|
|
253
|
+
return this._viewportSize[this._secondarySizeDim];
|
|
254
|
+
}
|
|
255
|
+
_scheduleReflow() {
|
|
256
|
+
this._pendingReflow = true;
|
|
257
|
+
}
|
|
258
|
+
_scheduleLayoutUpdate() {
|
|
259
|
+
this._pendingLayoutUpdate = true;
|
|
260
|
+
this._scheduleReflow();
|
|
261
|
+
}
|
|
262
|
+
_triggerReflow() {
|
|
263
|
+
this._scheduleLayoutUpdate();
|
|
264
|
+
Promise.resolve().then(() => this.reflowIfNeeded());
|
|
265
|
+
}
|
|
266
|
+
_reflow() {
|
|
267
|
+
if (this._pendingLayoutUpdate) {
|
|
268
|
+
this._updateLayout();
|
|
269
|
+
this._pendingLayoutUpdate = false;
|
|
270
|
+
}
|
|
271
|
+
this._updateScrollSize();
|
|
272
|
+
this._setPositionFromPin();
|
|
273
|
+
this._getActiveItems();
|
|
274
|
+
this._updateVisibleIndices();
|
|
275
|
+
this._sendStateChangedMessage();
|
|
276
|
+
}
|
|
277
|
+
/**
|
|
278
|
+
* If we are supposed to be pinned to a particular
|
|
279
|
+
* item or set of coordinates, we set `_scrollPosition`
|
|
280
|
+
* accordingly and adjust `_scrollError` as needed
|
|
281
|
+
* so that the virtualizer can keep the scroll
|
|
282
|
+
* position in the DOM in sync
|
|
283
|
+
*/
|
|
284
|
+
_setPositionFromPin() {
|
|
285
|
+
if (this.pin !== null) {
|
|
286
|
+
const lastScrollPosition = this._scrollPosition;
|
|
287
|
+
const { index, block } = this.pin;
|
|
288
|
+
this._scrollPosition = this._calculateScrollIntoViewPosition({
|
|
289
|
+
index,
|
|
290
|
+
block: block || "start"
|
|
291
|
+
}) - this.offsetWithinScroller[this._positionDim];
|
|
292
|
+
this._scrollError = lastScrollPosition - this._scrollPosition;
|
|
293
|
+
}
|
|
294
|
+
}
|
|
295
|
+
/**
|
|
296
|
+
* Calculate the coordinates to scroll to, given
|
|
297
|
+
* a request to scroll to the element at a specific
|
|
298
|
+
* index.
|
|
299
|
+
*
|
|
300
|
+
* Supports the same positioning options (`start`,
|
|
301
|
+
* `center`, `end`, `nearest`) as the standard
|
|
302
|
+
* `Element.scrollIntoView()` method, but currently
|
|
303
|
+
* only considers the provided value in the `block`
|
|
304
|
+
* dimension, since we don't yet have any layouts
|
|
305
|
+
* that support virtualization in two dimensions.
|
|
306
|
+
*/
|
|
307
|
+
_calculateScrollIntoViewPosition(options) {
|
|
308
|
+
const { block } = options;
|
|
309
|
+
const index = Math.min(this.items.length, Math.max(0, options.index));
|
|
310
|
+
const itemStartPosition = this._getItemPosition(index)[this._positionDim];
|
|
311
|
+
let scrollPosition = itemStartPosition;
|
|
312
|
+
if (block !== "start") {
|
|
313
|
+
const itemSize = this._getItemSize(index)[this._sizeDim];
|
|
314
|
+
if (block === "center") scrollPosition = itemStartPosition - .5 * this._viewDim1 + .5 * itemSize;
|
|
315
|
+
else {
|
|
316
|
+
const itemEndPosition = itemStartPosition - this._viewDim1 + itemSize;
|
|
317
|
+
if (block === "end") scrollPosition = itemEndPosition;
|
|
318
|
+
else {
|
|
319
|
+
const currentScrollPosition = this._scrollPosition;
|
|
320
|
+
scrollPosition = Math.abs(currentScrollPosition - itemStartPosition) < Math.abs(currentScrollPosition - itemEndPosition) ? itemStartPosition : itemEndPosition;
|
|
321
|
+
}
|
|
322
|
+
}
|
|
323
|
+
}
|
|
324
|
+
scrollPosition += this.offsetWithinScroller[this._positionDim];
|
|
325
|
+
return this._clampScrollPosition(scrollPosition);
|
|
326
|
+
}
|
|
327
|
+
getScrollIntoViewCoordinates(options) {
|
|
328
|
+
return { [this._positionDim]: this._calculateScrollIntoViewPosition(options) };
|
|
329
|
+
}
|
|
330
|
+
_sendUnpinnedMessage() {
|
|
331
|
+
this._hostSink({ type: "unpinned" });
|
|
332
|
+
}
|
|
333
|
+
_sendVisibilityChangedMessage() {
|
|
334
|
+
this._hostSink({
|
|
335
|
+
type: "visibilityChanged",
|
|
336
|
+
firstVisible: this._firstVisible,
|
|
337
|
+
lastVisible: this._lastVisible
|
|
338
|
+
});
|
|
339
|
+
}
|
|
340
|
+
_sendStateChangedMessage() {
|
|
341
|
+
const childPositions = /* @__PURE__ */ new Map();
|
|
342
|
+
if (this._first !== -1 && this._last !== -1) for (let idx = this._first; idx <= this._last; idx++) childPositions.set(idx, this._getItemPosition(idx));
|
|
343
|
+
const message = {
|
|
344
|
+
type: "stateChanged",
|
|
345
|
+
scrollSize: {
|
|
346
|
+
[this._sizeDim]: this._scrollSize,
|
|
347
|
+
[this._secondarySizeDim]: null
|
|
348
|
+
},
|
|
349
|
+
range: {
|
|
350
|
+
first: this._first,
|
|
351
|
+
last: this._last,
|
|
352
|
+
firstVisible: this._firstVisible,
|
|
353
|
+
lastVisible: this._lastVisible
|
|
354
|
+
},
|
|
355
|
+
childPositions
|
|
356
|
+
};
|
|
357
|
+
if (this._scrollError) {
|
|
358
|
+
message.scrollError = {
|
|
359
|
+
[this._positionDim]: this._scrollError,
|
|
360
|
+
[this._secondaryPositionDim]: 0
|
|
361
|
+
};
|
|
362
|
+
this._scrollError = 0;
|
|
363
|
+
}
|
|
364
|
+
this._hostSink(message);
|
|
365
|
+
}
|
|
366
|
+
/**
|
|
367
|
+
* Number of items to display.
|
|
368
|
+
*/
|
|
369
|
+
get _num() {
|
|
370
|
+
if (this._first === -1 || this._last === -1) return 0;
|
|
371
|
+
return this._last - this._first + 1;
|
|
372
|
+
}
|
|
373
|
+
_checkThresholds() {
|
|
374
|
+
if (this._viewDim1 === 0 && this._num > 0 || this._pin !== null) this._scheduleReflow();
|
|
375
|
+
else {
|
|
376
|
+
const min = Math.max(0, this._scrollPosition - this._overhang);
|
|
377
|
+
const max = Math.min(this._scrollSize, this._scrollPosition + this._viewDim1 + this._overhang);
|
|
378
|
+
if (this._physicalMin > min || this._physicalMax < max) this._scheduleReflow();
|
|
379
|
+
else this._updateVisibleIndices({ emit: true });
|
|
380
|
+
}
|
|
381
|
+
}
|
|
382
|
+
/**
|
|
383
|
+
* Find the indices of the first and last items to intersect the viewport.
|
|
384
|
+
* Emit a visibleindiceschange event when either index changes.
|
|
385
|
+
*/
|
|
386
|
+
_updateVisibleIndices(options) {
|
|
387
|
+
if (this._first === -1 || this._last === -1) return;
|
|
388
|
+
let firstVisible = this._first;
|
|
389
|
+
while (firstVisible < this._last && Math.round(this._getItemPosition(firstVisible)[this._positionDim] + this._getItemSize(firstVisible)[this._sizeDim]) <= Math.round(this._scrollPosition)) firstVisible++;
|
|
390
|
+
let lastVisible = this._last;
|
|
391
|
+
while (lastVisible > this._first && Math.round(this._getItemPosition(lastVisible)[this._positionDim]) >= Math.round(this._scrollPosition + this._viewDim1)) lastVisible--;
|
|
392
|
+
if (firstVisible !== this._firstVisible || lastVisible !== this._lastVisible) {
|
|
393
|
+
this._firstVisible = firstVisible;
|
|
394
|
+
this._lastVisible = lastVisible;
|
|
395
|
+
if (options && options.emit) this._sendVisibilityChangedMessage();
|
|
396
|
+
}
|
|
397
|
+
}
|
|
398
|
+
};
|
|
399
|
+
//#endregion
|
|
400
|
+
//#region node_modules/.pnpm/@lit-labs+virtualizer@2.1.1/node_modules/@lit-labs/virtualizer/layouts/flow.js
|
|
401
|
+
/**
|
|
402
|
+
* @license
|
|
403
|
+
* Copyright 2021 Google LLC
|
|
404
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
405
|
+
*/
|
|
406
|
+
function leadingMargin(direction) {
|
|
407
|
+
return direction === "horizontal" ? "marginLeft" : "marginTop";
|
|
408
|
+
}
|
|
409
|
+
function trailingMargin(direction) {
|
|
410
|
+
return direction === "horizontal" ? "marginRight" : "marginBottom";
|
|
411
|
+
}
|
|
412
|
+
function offset(direction) {
|
|
413
|
+
return direction === "horizontal" ? "xOffset" : "yOffset";
|
|
414
|
+
}
|
|
415
|
+
function collapseMargins(a, b) {
|
|
416
|
+
const m = [a, b].sort();
|
|
417
|
+
return m[1] <= 0 ? Math.min(...m) : m[0] >= 0 ? Math.max(...m) : m[0] + m[1];
|
|
418
|
+
}
|
|
419
|
+
var MetricsCache = class {
|
|
420
|
+
constructor() {
|
|
421
|
+
this._childSizeCache = new SizeCache();
|
|
422
|
+
this._marginSizeCache = new SizeCache();
|
|
423
|
+
this._metricsCache = /* @__PURE__ */ new Map();
|
|
424
|
+
}
|
|
425
|
+
update(metrics, direction) {
|
|
426
|
+
const marginsToUpdate = /* @__PURE__ */ new Set();
|
|
427
|
+
Object.keys(metrics).forEach((key) => {
|
|
428
|
+
const k = Number(key);
|
|
429
|
+
this._metricsCache.set(k, metrics[k]);
|
|
430
|
+
this._childSizeCache.set(k, metrics[k][dim1(direction)]);
|
|
431
|
+
marginsToUpdate.add(k);
|
|
432
|
+
marginsToUpdate.add(k + 1);
|
|
433
|
+
});
|
|
434
|
+
for (const k of marginsToUpdate) {
|
|
435
|
+
const a = this._metricsCache.get(k)?.[leadingMargin(direction)] || 0;
|
|
436
|
+
const b = this._metricsCache.get(k - 1)?.[trailingMargin(direction)] || 0;
|
|
437
|
+
this._marginSizeCache.set(k, collapseMargins(a, b));
|
|
438
|
+
}
|
|
439
|
+
}
|
|
440
|
+
get averageChildSize() {
|
|
441
|
+
return this._childSizeCache.averageSize;
|
|
442
|
+
}
|
|
443
|
+
get totalChildSize() {
|
|
444
|
+
return this._childSizeCache.totalSize;
|
|
445
|
+
}
|
|
446
|
+
get averageMarginSize() {
|
|
447
|
+
return this._marginSizeCache.averageSize;
|
|
448
|
+
}
|
|
449
|
+
get totalMarginSize() {
|
|
450
|
+
return this._marginSizeCache.totalSize;
|
|
451
|
+
}
|
|
452
|
+
getLeadingMarginValue(index, direction) {
|
|
453
|
+
return this._metricsCache.get(index)?.[leadingMargin(direction)] || 0;
|
|
454
|
+
}
|
|
455
|
+
getChildSize(index) {
|
|
456
|
+
return this._childSizeCache.getSize(index);
|
|
457
|
+
}
|
|
458
|
+
getMarginSize(index) {
|
|
459
|
+
return this._marginSizeCache.getSize(index);
|
|
460
|
+
}
|
|
461
|
+
clear() {
|
|
462
|
+
this._childSizeCache.clear();
|
|
463
|
+
this._marginSizeCache.clear();
|
|
464
|
+
this._metricsCache.clear();
|
|
465
|
+
}
|
|
466
|
+
};
|
|
467
|
+
var FlowLayout = class extends BaseLayout {
|
|
468
|
+
constructor() {
|
|
469
|
+
super(...arguments);
|
|
470
|
+
/**
|
|
471
|
+
* Initial estimate of item size
|
|
472
|
+
*/
|
|
473
|
+
this._itemSize = {
|
|
474
|
+
width: 100,
|
|
475
|
+
height: 100
|
|
476
|
+
};
|
|
477
|
+
/**
|
|
478
|
+
* Indices of children mapped to their (position and length) in the scrolling
|
|
479
|
+
* direction. Used to keep track of children that are in range.
|
|
480
|
+
*/
|
|
481
|
+
this._physicalItems = /* @__PURE__ */ new Map();
|
|
482
|
+
/**
|
|
483
|
+
* Used in tandem with _physicalItems to track children in range across
|
|
484
|
+
* reflows.
|
|
485
|
+
*/
|
|
486
|
+
this._newPhysicalItems = /* @__PURE__ */ new Map();
|
|
487
|
+
/**
|
|
488
|
+
* Width and height of children by their index.
|
|
489
|
+
*/
|
|
490
|
+
this._metricsCache = new MetricsCache();
|
|
491
|
+
/**
|
|
492
|
+
* anchorIdx is the anchor around which we reflow. It is designed to allow
|
|
493
|
+
* jumping to any point of the scroll size. We choose it once and stick with
|
|
494
|
+
* it until stable. _first and _last are deduced around it.
|
|
495
|
+
*/
|
|
496
|
+
this._anchorIdx = null;
|
|
497
|
+
/**
|
|
498
|
+
* Position in the scrolling direction of the anchor child.
|
|
499
|
+
*/
|
|
500
|
+
this._anchorPos = null;
|
|
501
|
+
/**
|
|
502
|
+
* Whether all children in range were in range during the previous reflow.
|
|
503
|
+
*/
|
|
504
|
+
this._stable = true;
|
|
505
|
+
this._measureChildren = true;
|
|
506
|
+
this._estimate = true;
|
|
507
|
+
}
|
|
508
|
+
get measureChildren() {
|
|
509
|
+
return this._measureChildren;
|
|
510
|
+
}
|
|
511
|
+
/**
|
|
512
|
+
* Determine the average size of all children represented in the sizes
|
|
513
|
+
* argument.
|
|
514
|
+
*/
|
|
515
|
+
updateItemSizes(sizes) {
|
|
516
|
+
this._metricsCache.update(sizes, this.direction);
|
|
517
|
+
this._scheduleReflow();
|
|
518
|
+
}
|
|
519
|
+
/**
|
|
520
|
+
* Set the average item size based on the total length and number of children
|
|
521
|
+
* in range.
|
|
522
|
+
*/
|
|
523
|
+
_getPhysicalItem(idx) {
|
|
524
|
+
return this._newPhysicalItems.get(idx) ?? this._physicalItems.get(idx);
|
|
525
|
+
}
|
|
526
|
+
_getSize(idx) {
|
|
527
|
+
return this._getPhysicalItem(idx) && this._metricsCache.getChildSize(idx);
|
|
528
|
+
}
|
|
529
|
+
_getAverageSize() {
|
|
530
|
+
return this._metricsCache.averageChildSize || this._itemSize[this._sizeDim];
|
|
531
|
+
}
|
|
532
|
+
_estimatePosition(idx) {
|
|
533
|
+
const c = this._metricsCache;
|
|
534
|
+
if (this._first === -1 || this._last === -1) return c.averageMarginSize + idx * (c.averageMarginSize + this._getAverageSize());
|
|
535
|
+
else if (idx < this._first) {
|
|
536
|
+
const delta = this._first - idx;
|
|
537
|
+
return this._getPhysicalItem(this._first).pos - (c.getMarginSize(this._first - 1) || c.averageMarginSize) - (delta * c.averageChildSize + (delta - 1) * c.averageMarginSize);
|
|
538
|
+
} else {
|
|
539
|
+
const delta = idx - this._last;
|
|
540
|
+
return this._getPhysicalItem(this._last).pos + (c.getChildSize(this._last) || c.averageChildSize) + (c.getMarginSize(this._last) || c.averageMarginSize) + delta * (c.averageChildSize + c.averageMarginSize);
|
|
541
|
+
}
|
|
542
|
+
}
|
|
543
|
+
/**
|
|
544
|
+
* Returns the position in the scrolling direction of the item at idx.
|
|
545
|
+
* Estimates it if the item at idx is not in the DOM.
|
|
546
|
+
*/
|
|
547
|
+
_getPosition(idx) {
|
|
548
|
+
const item = this._getPhysicalItem(idx);
|
|
549
|
+
const { averageMarginSize } = this._metricsCache;
|
|
550
|
+
return idx === 0 ? this._metricsCache.getMarginSize(0) ?? averageMarginSize : item ? item.pos : this._estimatePosition(idx);
|
|
551
|
+
}
|
|
552
|
+
_calculateAnchor(lower, upper) {
|
|
553
|
+
if (lower <= 0) return 0;
|
|
554
|
+
if (upper > this._scrollSize - this._viewDim1) return this.items.length - 1;
|
|
555
|
+
return Math.max(0, Math.min(this.items.length - 1, Math.floor((lower + upper) / 2 / this._delta)));
|
|
556
|
+
}
|
|
557
|
+
_getAnchor(lower, upper) {
|
|
558
|
+
if (this._physicalItems.size === 0) return this._calculateAnchor(lower, upper);
|
|
559
|
+
if (this._first < 0) return this._calculateAnchor(lower, upper);
|
|
560
|
+
if (this._last < 0) return this._calculateAnchor(lower, upper);
|
|
561
|
+
const firstItem = this._getPhysicalItem(this._first), lastItem = this._getPhysicalItem(this._last), firstMin = firstItem.pos;
|
|
562
|
+
if (lastItem.pos + this._metricsCache.getChildSize(this._last) < lower) return this._calculateAnchor(lower, upper);
|
|
563
|
+
if (firstMin > upper) return this._calculateAnchor(lower, upper);
|
|
564
|
+
let candidateIdx = this._firstVisible - 1;
|
|
565
|
+
let cMax = -Infinity;
|
|
566
|
+
while (cMax < lower) cMax = this._getPhysicalItem(++candidateIdx).pos + this._metricsCache.getChildSize(candidateIdx);
|
|
567
|
+
return candidateIdx;
|
|
568
|
+
}
|
|
569
|
+
/**
|
|
570
|
+
* Updates _first and _last based on items that should be in the current
|
|
571
|
+
* viewed range.
|
|
572
|
+
*/
|
|
573
|
+
_getActiveItems() {
|
|
574
|
+
if (this._viewDim1 === 0 || this.items.length === 0) this._clearItems();
|
|
575
|
+
else this._getItems();
|
|
576
|
+
}
|
|
577
|
+
/**
|
|
578
|
+
* Sets the range to empty.
|
|
579
|
+
*/
|
|
580
|
+
_clearItems() {
|
|
581
|
+
this._first = -1;
|
|
582
|
+
this._last = -1;
|
|
583
|
+
this._physicalMin = 0;
|
|
584
|
+
this._physicalMax = 0;
|
|
585
|
+
const items = this._newPhysicalItems;
|
|
586
|
+
this._newPhysicalItems = this._physicalItems;
|
|
587
|
+
this._newPhysicalItems.clear();
|
|
588
|
+
this._physicalItems = items;
|
|
589
|
+
this._stable = true;
|
|
590
|
+
}
|
|
591
|
+
_getItems() {
|
|
592
|
+
const items = this._newPhysicalItems;
|
|
593
|
+
this._stable = true;
|
|
594
|
+
let lower, upper;
|
|
595
|
+
if (this.pin !== null) {
|
|
596
|
+
const { index } = this.pin;
|
|
597
|
+
this._anchorIdx = index;
|
|
598
|
+
this._anchorPos = this._getPosition(index);
|
|
599
|
+
}
|
|
600
|
+
lower = this._scrollPosition - this._overhang;
|
|
601
|
+
upper = this._scrollPosition + this._viewDim1 + this._overhang;
|
|
602
|
+
if (upper < 0 || lower > this._scrollSize) {
|
|
603
|
+
this._clearItems();
|
|
604
|
+
return;
|
|
605
|
+
}
|
|
606
|
+
if (this._anchorIdx === null || this._anchorPos === null) {
|
|
607
|
+
this._anchorIdx = this._getAnchor(lower, upper);
|
|
608
|
+
this._anchorPos = this._getPosition(this._anchorIdx);
|
|
609
|
+
}
|
|
610
|
+
let anchorSize = this._getSize(this._anchorIdx);
|
|
611
|
+
if (anchorSize === void 0) {
|
|
612
|
+
this._stable = false;
|
|
613
|
+
anchorSize = this._getAverageSize();
|
|
614
|
+
}
|
|
615
|
+
const anchorLeadingMargin = this._metricsCache.getMarginSize(this._anchorIdx) ?? this._metricsCache.averageMarginSize;
|
|
616
|
+
const anchorTrailingMargin = this._metricsCache.getMarginSize(this._anchorIdx + 1) ?? this._metricsCache.averageMarginSize;
|
|
617
|
+
if (this._anchorIdx === 0) this._anchorPos = anchorLeadingMargin;
|
|
618
|
+
if (this._anchorIdx === this.items.length - 1) this._anchorPos = this._scrollSize - anchorTrailingMargin - anchorSize;
|
|
619
|
+
let anchorErr = 0;
|
|
620
|
+
if (this._anchorPos + anchorSize + anchorTrailingMargin < lower) anchorErr = lower - (this._anchorPos + anchorSize + anchorTrailingMargin);
|
|
621
|
+
if (this._anchorPos - anchorLeadingMargin > upper) anchorErr = upper - (this._anchorPos - anchorLeadingMargin);
|
|
622
|
+
if (anchorErr) {
|
|
623
|
+
this._scrollPosition -= anchorErr;
|
|
624
|
+
lower -= anchorErr;
|
|
625
|
+
upper -= anchorErr;
|
|
626
|
+
this._scrollError += anchorErr;
|
|
627
|
+
}
|
|
628
|
+
items.set(this._anchorIdx, {
|
|
629
|
+
pos: this._anchorPos,
|
|
630
|
+
size: anchorSize
|
|
631
|
+
});
|
|
632
|
+
this._first = this._last = this._anchorIdx;
|
|
633
|
+
this._physicalMin = this._anchorPos - anchorLeadingMargin;
|
|
634
|
+
this._physicalMax = this._anchorPos + anchorSize + anchorTrailingMargin;
|
|
635
|
+
while (this._physicalMin > lower && this._first > 0) {
|
|
636
|
+
let size = this._getSize(--this._first);
|
|
637
|
+
if (size === void 0) {
|
|
638
|
+
this._stable = false;
|
|
639
|
+
size = this._getAverageSize();
|
|
640
|
+
}
|
|
641
|
+
let margin = this._metricsCache.getMarginSize(this._first);
|
|
642
|
+
if (margin === void 0) {
|
|
643
|
+
this._stable = false;
|
|
644
|
+
margin = this._metricsCache.averageMarginSize;
|
|
645
|
+
}
|
|
646
|
+
this._physicalMin -= size;
|
|
647
|
+
const pos = this._physicalMin;
|
|
648
|
+
items.set(this._first, {
|
|
649
|
+
pos,
|
|
650
|
+
size
|
|
651
|
+
});
|
|
652
|
+
this._physicalMin -= margin;
|
|
653
|
+
if (this._stable === false && this._estimate === false) break;
|
|
654
|
+
}
|
|
655
|
+
while (this._physicalMax < upper && this._last < this.items.length - 1) {
|
|
656
|
+
let size = this._getSize(++this._last);
|
|
657
|
+
if (size === void 0) {
|
|
658
|
+
this._stable = false;
|
|
659
|
+
size = this._getAverageSize();
|
|
660
|
+
}
|
|
661
|
+
let margin = this._metricsCache.getMarginSize(this._last);
|
|
662
|
+
if (margin === void 0) {
|
|
663
|
+
this._stable = false;
|
|
664
|
+
margin = this._metricsCache.averageMarginSize;
|
|
665
|
+
}
|
|
666
|
+
const pos = this._physicalMax;
|
|
667
|
+
items.set(this._last, {
|
|
668
|
+
pos,
|
|
669
|
+
size
|
|
670
|
+
});
|
|
671
|
+
this._physicalMax += size + margin;
|
|
672
|
+
if (!this._stable && !this._estimate) break;
|
|
673
|
+
}
|
|
674
|
+
const extentErr = this._calculateError();
|
|
675
|
+
if (extentErr) {
|
|
676
|
+
this._physicalMin -= extentErr;
|
|
677
|
+
this._physicalMax -= extentErr;
|
|
678
|
+
this._anchorPos -= extentErr;
|
|
679
|
+
this._scrollPosition -= extentErr;
|
|
680
|
+
items.forEach((item) => item.pos -= extentErr);
|
|
681
|
+
this._scrollError += extentErr;
|
|
682
|
+
}
|
|
683
|
+
if (this._stable) {
|
|
684
|
+
this._newPhysicalItems = this._physicalItems;
|
|
685
|
+
this._newPhysicalItems.clear();
|
|
686
|
+
this._physicalItems = items;
|
|
687
|
+
}
|
|
688
|
+
}
|
|
689
|
+
_calculateError() {
|
|
690
|
+
if (this._first === 0) return this._physicalMin;
|
|
691
|
+
else if (this._physicalMin <= 0) return this._physicalMin - this._first * this._delta;
|
|
692
|
+
else if (this._last === this.items.length - 1) return this._physicalMax - this._scrollSize;
|
|
693
|
+
else if (this._physicalMax >= this._scrollSize) return this._physicalMax - this._scrollSize + (this.items.length - 1 - this._last) * this._delta;
|
|
694
|
+
return 0;
|
|
695
|
+
}
|
|
696
|
+
_reflow() {
|
|
697
|
+
const { _first, _last } = this;
|
|
698
|
+
super._reflow();
|
|
699
|
+
if (this._first === -1 && this._last == -1 || this._first === _first && this._last === _last) this._resetReflowState();
|
|
700
|
+
}
|
|
701
|
+
_resetReflowState() {
|
|
702
|
+
this._anchorIdx = null;
|
|
703
|
+
this._anchorPos = null;
|
|
704
|
+
this._stable = true;
|
|
705
|
+
}
|
|
706
|
+
_updateScrollSize() {
|
|
707
|
+
const { averageMarginSize } = this._metricsCache;
|
|
708
|
+
this._scrollSize = Math.max(1, this.items.length * (averageMarginSize + this._getAverageSize()) + averageMarginSize);
|
|
709
|
+
}
|
|
710
|
+
/**
|
|
711
|
+
* Returns the average size (precise or estimated) of an item in the scrolling direction,
|
|
712
|
+
* including any surrounding space.
|
|
713
|
+
*/
|
|
714
|
+
get _delta() {
|
|
715
|
+
const { averageMarginSize } = this._metricsCache;
|
|
716
|
+
return this._getAverageSize() + averageMarginSize;
|
|
717
|
+
}
|
|
718
|
+
/**
|
|
719
|
+
* Returns the top and left positioning of the item at idx.
|
|
720
|
+
*/
|
|
721
|
+
_getItemPosition(idx) {
|
|
722
|
+
return {
|
|
723
|
+
[this._positionDim]: this._getPosition(idx),
|
|
724
|
+
[this._secondaryPositionDim]: 0,
|
|
725
|
+
[offset(this.direction)]: -(this._metricsCache.getLeadingMarginValue(idx, this.direction) ?? this._metricsCache.averageMarginSize)
|
|
726
|
+
};
|
|
727
|
+
}
|
|
728
|
+
/**
|
|
729
|
+
* Returns the height and width of the item at idx.
|
|
730
|
+
*/
|
|
731
|
+
_getItemSize(idx) {
|
|
732
|
+
return {
|
|
733
|
+
[this._sizeDim]: this._getSize(idx) || this._getAverageSize(),
|
|
734
|
+
[this._secondarySizeDim]: this._itemSize[this._secondarySizeDim]
|
|
735
|
+
};
|
|
736
|
+
}
|
|
737
|
+
_viewDim2Changed() {
|
|
738
|
+
this._metricsCache.clear();
|
|
739
|
+
this._scheduleReflow();
|
|
740
|
+
}
|
|
741
|
+
};
|
|
742
|
+
//#endregion
|
|
743
|
+
export { FlowLayout };
|
|
744
|
+
|
|
745
|
+
//# sourceMappingURL=flow-DK8vmxvN.js.map
|