New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
svelte-bricks
Advanced tools
svelte-bricks - npm Package Compare versions
Comparing version 0.3.0 to 0.3.1
@@ -5,7 +5,7 @@ import type { Snippet } from 'svelte'; | ||
| animate?: boolean; | ||
| calcCols?: ((masonryWidth: number, minColWidth: number, gap: number) => number) | undefined; | ||
| calcCols?: (masonryWidth: number, minColWidth: number, gap: number) => number; | ||
| columnClass?: string; | ||
| duration?: number; | ||
| gap?: number; | ||
| getId?: ((item: Item) => string | number) | undefined; | ||
| getId?: (item: Item) => string | number; | ||
| idKey?: string; | ||
@@ -19,7 +19,11 @@ items: Item[]; | ||
| class?: string; | ||
| children?: Snippet; | ||
| children?: Snippet<[{ | ||
| idx: number; | ||
| item: Item; | ||
| }]>; | ||
| div?: HTMLDivElement; | ||
| }; | ||
| events(): {}; | ||
| slots(): {}; | ||
| bindings(): "masonryHeight" | "masonryWidth"; | ||
| bindings(): "div" | "masonryHeight" | "masonryWidth"; | ||
| exports(): {}; | ||
@@ -26,0 +30,0 @@ } |
@@ -8,3 +8,3 @@ { | ||
| "license": "MIT", | ||
| "version": "0.3.0", | ||
| "version": "0.3.1", | ||
| "type": "module", | ||
@@ -24,26 +24,17 @@ "svelte": "./dist/index.js", | ||
| "dependencies": { | ||
| "svelte": "^5.20.1" | ||
| "svelte": "^5.22.6" | ||
| }, | ||
| "devDependencies": { | ||
| "@stylistic/eslint-plugin": "^3.1.0", | ||
| "@sveltejs/adapter-static": "^3.0.8", | ||
| "@sveltejs/kit": "^2.17.2", | ||
| "@sveltejs/kit": "^2.19.0", | ||
| "@sveltejs/package": "^2.3.10", | ||
| "@typescript-eslint/eslint-plugin": "^8.24.0", | ||
| "@typescript-eslint/parser": "^8.24.0", | ||
| "eslint": "^9.20.1", | ||
| "eslint-plugin-svelte": "^2.46.1", | ||
| "jsdom": "^26.0.0", | ||
| "mdsvex": "^0.12.3", | ||
| "prettier": "^3.5.1", | ||
| "prettier-plugin-svelte": "^3.3.3", | ||
| "svelte-check": "^4.1.4", | ||
| "svelte-check": "^4.1.5", | ||
| "svelte-preprocess": "^6.0.3", | ||
| "svelte-toc": "^0.5.9", | ||
| "svelte-zoo": "^0.4.16", | ||
| "svelte2tsx": "^0.7.34", | ||
| "typescript": "^5.7.3", | ||
| "typescript-eslint": "^8.24.0", | ||
| "vite": "^6.1.0", | ||
| "vitest": "^3.0.5" | ||
| "svelte2tsx": "^0.7.35", | ||
| "vite": "^6.2.1", | ||
| "vitest": "^3.0.8" | ||
| }, | ||
@@ -50,0 +41,0 @@ "keywords": [ |
@@ -36,11 +36,10 @@ <div class="hide-in-docs"> | ||
| let nItems = 30 | ||
| $: items = [...Array(nItems).keys()] | ||
| let nItems = $state(30); | ||
| let items = $derived([...Array(nItems).keys()]) | ||
| let [minColWidth, maxColWidth, gap] = [200, 800, 20] | ||
| let width, height | ||
| let width = $state(0), height = $state(0) | ||
| </script> | ||
| Masonry size: <span>{width}px</span> × <span>{height}px</span> (w × | ||
| h) | ||
| Masonry size: <span>{width}px</span> × <span>{height}px</span> (w × h) | ||
@@ -52,7 +51,9 @@ <Masonry | ||
| {gap} | ||
| let:item | ||
| bind:masonryWidth={width} | ||
| bind:masonryHeight={height} | ||
| > | ||
| <Some {item} /> | ||
| {#snippet children({ item })} | ||
| <Some {item} /> | ||
| {/snippet} | ||
| </Masonry> | ||
@@ -59,0 +60,0 @@ ``` |
Sorry, the diff of this file is not supported yet
No alert changes
Improved metrics
- Dev dependency count
12
-42.86%- Lines of code
41
10.81%- Number of lines in readme file
179
0.56%Worsened metrics
- Total package byte prevSize
11965
-0.44%Dependency changes
Updated
svelte@^5.22.6