svelte-bricks 0.2.0 → 0.2.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 -16
- package/dist/Masonry.svelte.d.ts +2 -2
- package/package.json +22 -21
- package/readme.md +2 -2
package/dist/Masonry.svelte
CHANGED
|
@@ -1,17 +1,3 @@
|
|
|
1
|
-
<style>
|
|
2
|
-
:where(div.masonry) {
|
|
3
|
-
display: flex;
|
|
4
|
-
justify-content: center;
|
|
5
|
-
overflow-wrap: anywhere;
|
|
6
|
-
box-sizing: border-box;
|
|
7
|
-
}
|
|
8
|
-
:where(div.masonry div.col) {
|
|
9
|
-
display: grid;
|
|
10
|
-
height: max-content;
|
|
11
|
-
width: 100%;
|
|
12
|
-
}
|
|
13
|
-
</style>
|
|
14
|
-
|
|
15
1
|
<script>import { flip } from 'svelte/animate';
|
|
16
2
|
import { fade } from 'svelte/transition';
|
|
17
3
|
export let animate = true;
|
|
@@ -43,6 +29,21 @@ $: itemsToCols = items.reduce((cols, item, idx) => {
|
|
|
43
29
|
}, Array(nCols).fill(null).map(() => []) // prettier-ignore
|
|
44
30
|
);
|
|
45
31
|
</script>
|
|
32
|
+
<style>
|
|
33
|
+
:where(div.masonry) {
|
|
34
|
+
display: flex;
|
|
35
|
+
justify-content: center;
|
|
36
|
+
overflow-wrap: anywhere;
|
|
37
|
+
box-sizing: border-box;
|
|
38
|
+
}
|
|
39
|
+
:where(div.masonry div.col) {
|
|
40
|
+
display: grid;
|
|
41
|
+
height: max-content;
|
|
42
|
+
width: 100%;
|
|
43
|
+
}
|
|
44
|
+
</style>
|
|
45
|
+
|
|
46
|
+
|
|
46
47
|
<div
|
|
47
48
|
class="masonry {className}"
|
|
48
49
|
bind:clientWidth={masonryWidth}
|
|
@@ -54,8 +55,8 @@ $: itemsToCols = items.reduce((cols, item, idx) => {
|
|
|
54
55
|
{#if animate}
|
|
55
56
|
{#each col as [item, idx] (getId(item))}
|
|
56
57
|
<div
|
|
57
|
-
in:fade
|
|
58
|
-
out:fade
|
|
58
|
+
in:fade={{ delay: 100, duration }}
|
|
59
|
+
out:fade={{ delay: 0, duration }}
|
|
59
60
|
animate:flip={{ duration }}
|
|
60
61
|
>
|
|
61
62
|
<slot {idx} {item}>
|
package/dist/Masonry.svelte.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { SvelteComponent } from "svelte";
|
|
2
2
|
declare class __sveltets_Render<Item> {
|
|
3
3
|
props(): {
|
|
4
4
|
animate?: boolean | undefined;
|
|
@@ -28,6 +28,6 @@ declare class __sveltets_Render<Item> {
|
|
|
28
28
|
export type MasonryProps<Item> = ReturnType<__sveltets_Render<Item>['props']>;
|
|
29
29
|
export type MasonryEvents<Item> = ReturnType<__sveltets_Render<Item>['events']>;
|
|
30
30
|
export type MasonrySlots<Item> = ReturnType<__sveltets_Render<Item>['slots']>;
|
|
31
|
-
export default class Masonry<Item> extends
|
|
31
|
+
export default class Masonry<Item> extends SvelteComponent<MasonryProps<Item>, MasonryEvents<Item>, MasonrySlots<Item>> {
|
|
32
32
|
}
|
|
33
33
|
export {};
|
package/package.json
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
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.2.
|
|
8
|
+
"version": "0.2.1",
|
|
9
9
|
"type": "module",
|
|
10
10
|
"svelte": "./dist/index.js",
|
|
11
11
|
"bugs": "https://github.com/janosh/svelte-bricks/issues",
|
|
@@ -20,28 +20,28 @@
|
|
|
20
20
|
"changelog": "npx auto-changelog --package --output changelog.md --hide-credit --commit-limit false"
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
|
-
"svelte": "^
|
|
23
|
+
"svelte": "^4.2.1"
|
|
24
24
|
},
|
|
25
25
|
"devDependencies": {
|
|
26
|
-
"@sveltejs/adapter-static": "^2.0.
|
|
27
|
-
"@sveltejs/kit": "^1.
|
|
28
|
-
"@sveltejs/package": "^2.
|
|
29
|
-
"@typescript-eslint/eslint-plugin": "^
|
|
30
|
-
"@typescript-eslint/parser": "^
|
|
31
|
-
"eslint": "^8.
|
|
32
|
-
"eslint-plugin-
|
|
33
|
-
"jsdom": "^
|
|
34
|
-
"mdsvex": "^0.
|
|
35
|
-
"prettier": "^
|
|
36
|
-
"prettier-plugin-svelte": "^
|
|
37
|
-
"svelte-check": "^3.
|
|
38
|
-
"svelte-preprocess": "^5.0.
|
|
39
|
-
"svelte-toc": "^0.5.
|
|
40
|
-
"svelte-zoo": "^0.4.
|
|
41
|
-
"svelte2tsx": "^0.6.
|
|
42
|
-
"typescript": "^5.
|
|
43
|
-
"vite": "^4.
|
|
44
|
-
"vitest": "^0.
|
|
26
|
+
"@sveltejs/adapter-static": "^2.0.3",
|
|
27
|
+
"@sveltejs/kit": "^1.25.0",
|
|
28
|
+
"@sveltejs/package": "^2.2.2",
|
|
29
|
+
"@typescript-eslint/eslint-plugin": "^6.7.2",
|
|
30
|
+
"@typescript-eslint/parser": "^6.7.2",
|
|
31
|
+
"eslint": "^8.49.0",
|
|
32
|
+
"eslint-plugin-svelte": "^2.33.2",
|
|
33
|
+
"jsdom": "^22.1.0",
|
|
34
|
+
"mdsvex": "^0.11.0",
|
|
35
|
+
"prettier": "^3.0.3",
|
|
36
|
+
"prettier-plugin-svelte": "^3.0.3",
|
|
37
|
+
"svelte-check": "^3.5.2",
|
|
38
|
+
"svelte-preprocess": "^5.0.4",
|
|
39
|
+
"svelte-toc": "^0.5.6",
|
|
40
|
+
"svelte-zoo": "^0.4.9",
|
|
41
|
+
"svelte2tsx": "^0.6.22",
|
|
42
|
+
"typescript": "^5.2.2",
|
|
43
|
+
"vite": "^4.4.9",
|
|
44
|
+
"vitest": "^0.34.5"
|
|
45
45
|
},
|
|
46
46
|
"keywords": [
|
|
47
47
|
"svelte",
|
|
@@ -64,6 +64,7 @@
|
|
|
64
64
|
"default": "./dist/index.js"
|
|
65
65
|
}
|
|
66
66
|
},
|
|
67
|
+
"types": "./dist/index.d.ts",
|
|
67
68
|
"files": [
|
|
68
69
|
"dist"
|
|
69
70
|
]
|