svelte-bricks 0.4.0 → 0.4.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/Masonry.svelte +17 -6
- package/package.json +6 -6
package/dist/Masonry.svelte
CHANGED
|
@@ -177,15 +177,17 @@ let effective_animate = $derived(animate && !can_virtualize);
|
|
|
177
177
|
<!-- Dynamic container query styles for CLS-free SSR -->
|
|
178
178
|
<svelte:element this={`style`}>{container_query_css}</svelte:element>
|
|
179
179
|
|
|
180
|
-
<!-- deno-fmt-ignore -->
|
|
181
180
|
<div
|
|
182
181
|
bind:clientWidth={masonryWidth}
|
|
183
182
|
bind:clientHeight={masonryHeight}
|
|
184
183
|
bind:this={div}
|
|
185
184
|
onscroll={virtualize ? on_scroll : undefined}
|
|
185
|
+
style="display: flex; width: 100%; justify-content: center; box-sizing: border-box"
|
|
186
186
|
style:gap="{gap}px"
|
|
187
187
|
style:overflow-y={virtualize ? `auto` : undefined}
|
|
188
|
-
style:height={virtualize
|
|
188
|
+
style:height={virtualize
|
|
189
|
+
? (typeof height === `number` ? `${height}px` : height ?? `400px`)
|
|
190
|
+
: undefined}
|
|
189
191
|
{...rest}
|
|
190
192
|
class="masonry {rest.class ?? ``}"
|
|
191
193
|
>
|
|
@@ -194,7 +196,14 @@ let effective_animate = $derived(animate && !can_virtualize);
|
|
|
194
196
|
{@const visible_items = col.slice(start, end)}
|
|
195
197
|
<div
|
|
196
198
|
class="col col-{col_idx} {columnClass}"
|
|
197
|
-
style="
|
|
199
|
+
style:display="grid"
|
|
200
|
+
style:flex="1 1 0"
|
|
201
|
+
style:min-width="0"
|
|
202
|
+
style:gap="{gap}px"
|
|
203
|
+
style:max-width="{maxColWidth}px"
|
|
204
|
+
style:padding-top={can_virtualize ? `${col_padding_top[col_idx]}px` : undefined}
|
|
205
|
+
style:padding-bottom={can_virtualize ? `${col_padding_bottom[col_idx]}px` : undefined}
|
|
206
|
+
style={columnStyle || undefined}
|
|
198
207
|
>
|
|
199
208
|
{#if effective_animate}
|
|
200
209
|
{#each visible_items as [item, item_idx] (getId(item))}
|
|
@@ -223,16 +232,18 @@ let effective_animate = $derived(animate && !can_virtualize);
|
|
|
223
232
|
</div>
|
|
224
233
|
|
|
225
234
|
<style>
|
|
226
|
-
|
|
235
|
+
div.masonry {
|
|
227
236
|
container-type: inline-size;
|
|
228
237
|
display: flex;
|
|
229
238
|
justify-content: center;
|
|
230
239
|
overflow-wrap: anywhere;
|
|
231
240
|
box-sizing: border-box;
|
|
241
|
+
width: 100%;
|
|
232
242
|
}
|
|
233
|
-
|
|
243
|
+
div.masonry div.col {
|
|
234
244
|
display: grid;
|
|
235
245
|
height: max-content;
|
|
236
|
-
|
|
246
|
+
flex: 1 1 0;
|
|
247
|
+
min-width: 0;
|
|
237
248
|
}
|
|
238
249
|
</style>
|
package/package.json
CHANGED
|
@@ -5,19 +5,19 @@
|
|
|
5
5
|
"homepage": "https://janosh.github.io/svelte-bricks",
|
|
6
6
|
"repository": "https://github.com/janosh/svelte-bricks",
|
|
7
7
|
"license": "MIT",
|
|
8
|
-
"version": "0.4.
|
|
8
|
+
"version": "0.4.1",
|
|
9
9
|
"type": "module",
|
|
10
10
|
"svelte": "./dist/index.js",
|
|
11
11
|
"bugs": "https://github.com/janosh/svelte-bricks/issues",
|
|
12
12
|
"dependencies": {
|
|
13
|
-
"svelte": "^5.46.
|
|
13
|
+
"svelte": "^5.46.4"
|
|
14
14
|
},
|
|
15
15
|
"devDependencies": {
|
|
16
16
|
"@sveltejs/adapter-static": "^3.0.10",
|
|
17
|
-
"@sveltejs/kit": "^2.49.
|
|
17
|
+
"@sveltejs/kit": "^2.49.5",
|
|
18
18
|
"@sveltejs/package": "^2.5.7",
|
|
19
|
-
"@vitest/coverage-v8": "^4.0.
|
|
20
|
-
"
|
|
19
|
+
"@vitest/coverage-v8": "^4.0.17",
|
|
20
|
+
"happy-dom": "^18.0.1",
|
|
21
21
|
"mdsvex": "^0.12.6",
|
|
22
22
|
"svelte-check": "^4.3.5",
|
|
23
23
|
"svelte-multiselect": "^11.5.1",
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
"svelte-toc": "^0.6.2",
|
|
26
26
|
"svelte2tsx": "^0.7.46",
|
|
27
27
|
"vite": "^7.3.1",
|
|
28
|
-
"vitest": "^4.0.
|
|
28
|
+
"vitest": "^4.0.17"
|
|
29
29
|
},
|
|
30
30
|
"keywords": [
|
|
31
31
|
"svelte",
|