libraries-dev-svelte 0.3.0 → 0.3.2
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.
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
let {
|
|
7
7
|
blur = 6,
|
|
8
8
|
contrast = 18,
|
|
9
|
-
fill = 'var(--modal-bg, #
|
|
9
|
+
fill = 'var(--modal-bg, light-dark(#ffffff, #232326))',
|
|
10
10
|
shadow = '',
|
|
11
11
|
items,
|
|
12
12
|
onAction,
|
|
@@ -61,8 +61,10 @@
|
|
|
61
61
|
let copied = $state(false);
|
|
62
62
|
let reducedMotion = $state(false);
|
|
63
63
|
let groupElement: HTMLDivElement;
|
|
64
|
-
|
|
65
|
-
|
|
64
|
+
/* $state so `bind:this={arr[index]}` targets are reactive — plain arrays
|
|
65
|
+
trigger Svelte 5's binding_property_non_reactive warning per instance. */
|
|
66
|
+
let itemWrappers = $state<Array<HTMLDivElement | undefined>>([]);
|
|
67
|
+
let satelliteButtons = $state<Array<HTMLButtonElement | undefined>>([]);
|
|
66
68
|
let mainButton: HTMLButtonElement;
|
|
67
69
|
let itemBoxes = $state<Array<BlobBox | null>>([]);
|
|
68
70
|
let groupSize = $state({ w: 0, h: 0 });
|
|
@@ -91,6 +93,16 @@
|
|
|
91
93
|
),
|
|
92
94
|
);
|
|
93
95
|
const filterPad = $derived(Math.ceil(blur * 3 + shadowExtent + 24));
|
|
96
|
+
/* The filter region must cover satellite travel, not just the stage box.
|
|
97
|
+
Stage-sized regions clip the blobs of any satellite that translates
|
|
98
|
+
outside the stage (small stages, wide spreads). */
|
|
99
|
+
const travelExtent = $derived(
|
|
100
|
+
allItems.reduce(
|
|
101
|
+
(max, item) => Math.max(max, Math.max(Math.abs(item.x), Math.abs(item.y)) * menuSettings.spread),
|
|
102
|
+
0,
|
|
103
|
+
),
|
|
104
|
+
);
|
|
105
|
+
const regionPad = $derived(filterPad + Math.ceil(travelExtent));
|
|
94
106
|
const intercept = $derived(Math.round((0.5 - contrast * (5 / 12)) * 100) / 100);
|
|
95
107
|
const phase = $derived(
|
|
96
108
|
menuOpen
|
|
@@ -271,10 +283,10 @@
|
|
|
271
283
|
<filter
|
|
272
284
|
id={filterId}
|
|
273
285
|
filterUnits="userSpaceOnUse"
|
|
274
|
-
x={-
|
|
275
|
-
y={-
|
|
276
|
-
width={groupSize.w +
|
|
277
|
-
height={groupSize.h +
|
|
286
|
+
x={-regionPad}
|
|
287
|
+
y={-regionPad}
|
|
288
|
+
width={groupSize.w + regionPad * 2}
|
|
289
|
+
height={groupSize.h + regionPad * 2}
|
|
278
290
|
color-interpolation-filters="sRGB"
|
|
279
291
|
>
|
|
280
292
|
<feGaussianBlur in="SourceGraphic" stdDeviation={blur} result="blur" />
|