Skip to content

Commit 3c8f03f

Browse files
arackafarackaf
authored
Arackis/storybook upgrade (#130)
* first story rendering * Storybook work * Remove show code buttons * First demos working * Cleanup * Final cleanup
1 parent 76b0250 commit 3c8f03f

16 files changed

+6821
-21363
lines changed

‎.storybook/main.js

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
1-
module.exports = {
1+
export default {
22
stories: ["../stories/**/*.stories.js"],
3-
addons: [
4-
"@storybook/addon-actions",
5-
"@storybook/addon-links",
6-
"@storybook/addon-storysource",
7-
"@storybook/addon-notes/register",
8-
],
3+
addons: ["@storybook/addon-links", "@storybook/addon-essentials", "@storybook/addon-interactions"],
4+
framework: {
5+
name: "@storybook/sveltekit",
6+
options: {},
7+
},
8+
docs: {
9+
autodocs: true,
10+
},
911
};

‎.storybook/preview-head.html

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
<script>
2+
window.global = window;
3+
</script>

‎package-lock.json

Lines changed: 6711 additions & 11179 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 9 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,11 @@
33
"version": "2.0.1",
44
"description": "Svelte component for fileupload and file dropzone",
55
"scripts": {
6-
"build": "rollup -c",
76
"package": "svelte-kit sync && svelte-package && publint",
87
"prepublishOnly": "npm run package",
98
"test": "echo \"Error: no test specified\" && exit 1",
10-
"storybook": "start-storybook -p 6006",
11-
"build-storybook": "build-storybook"
9+
"storybook": "storybook dev -p 6006",
10+
"build-storybook": "storybook build"
1211
},
1312
"exports": {
1413
"./Dropzone.svelte": {
@@ -35,23 +34,18 @@
3534
"svelte": "^3.54.0"
3635
},
3736
"devDependencies": {
38-
"@babel/core": "7.18.10",
39-
"@rollup/plugin-commonjs": "22.0.2",
40-
"@rollup/plugin-node-resolve": "13.3.0",
41-
"@storybook/addon-actions": "6.5.10",
42-
"@storybook/addon-links": "6.5.10",
43-
"@storybook/addon-notes": "5.3.21",
44-
"@storybook/addon-storysource": "6.5.10",
45-
"@storybook/addons": "6.5.10",
46-
"@storybook/svelte": "6.5.10",
37+
"@storybook/addons": "7.0.0-rc.5",
38+
"@storybook/addon-links": "^7.0.0-rc.5",
39+
"@storybook/addon-essentials": "^7.0.0-rc.5",
40+
"@storybook/addon-interactions": "^7.0.0-rc.5",
41+
"@storybook/svelte": "7.0.0-rc.5",
42+
"@storybook/sveltekit": "^7.0.0-rc.5",
4743
"@sveltejs/kit": "^1.5.0",
4844
"@sveltejs/package": "^2.0.0",
4945
"babel-loader": "8.2.5",
5046
"publint": "^0.1.9",
51-
"rollup": "2.77.2",
52-
"rollup-plugin-svelte": "7.1.0",
47+
"storybook": "^7.0.0-rc.5",
5348
"svelte": "^3.54.0",
54-
"svelte-loader": "3.1.3",
5549
"vite": "^4.0.0"
5650
},
5751
"keywords": [

‎stories/1-dropzone.stories.js

Lines changed: 42 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,54 @@
1-
import { action } from "@storybook/addon-actions";
1+
//import { action } from "@storybook/addon-actions";
22

33
import BasicDropZoneView from "./views/BasicDropzoneView.svelte";
4+
import BasicDropZoneViewSource from "./views/BasicDropzoneView.svelte?raw";
45
import DisabledDropzoneView from "./views/DisabledDropzoneView.svelte";
6+
import DisabledDropzoneViewSource from "./views/DisabledDropzoneView.svelte?raw";
57
import CustomSlotDropzoneView from "./views/CustomSlotDropzoneView.svelte";
8+
import CustomSlotDropzoneViewSource from "./views/CustomSlotDropzoneView.svelte?raw";
69
import NoClickDropZoneView from "./views/NoClickDropzoneView.svelte";
10+
import NoClickDropZoneViewSource from "./views/NoClickDropzoneView.svelte?raw";
711
import NoDragDropzoneView from "./views/NoDragDropzoneView.svelte";
12+
import NoDragDropzoneViewSource from "./views/NoDragDropzoneView.svelte?raw";
813

9-
import intro from "./../README.md";
14+
import { sourceParameters } from "./helpers";
1015

1116
export default {
1217
title: "Examples",
13-
parameters: {
14-
notes: { Introduction: intro },
15-
},
18+
component: null,
1619
};
1720

18-
export const BasicDropzone = () => ({
19-
Component: BasicDropZoneView,
20-
props: {},
21-
});
22-
23-
export const DisabledDropzone = () => ({
24-
Component: DisabledDropzoneView,
25-
props: {},
26-
});
27-
28-
export const CustomSlotDropzone = () => ({
29-
Component: CustomSlotDropzoneView,
30-
props: {},
31-
});
32-
33-
export const DropZoneWithClickDisabled = () => ({
34-
Component: NoClickDropZoneView,
35-
props: {},
36-
});
37-
38-
export const DropZoneWithDragDisabled = () => ({
39-
Component: NoDragDropzoneView,
40-
props: {},
41-
});
21+
export const BasicDropzone = {
22+
...sourceParameters(BasicDropZoneViewSource),
23+
render: () => ({
24+
Component: BasicDropZoneView,
25+
}),
26+
};
27+
28+
export const DisabledDropzone = {
29+
...sourceParameters(DisabledDropzoneViewSource),
30+
render: () => ({
31+
Component: DisabledDropzoneView,
32+
}),
33+
};
34+
35+
export const CustomSlotDropzone = {
36+
...sourceParameters(CustomSlotDropzoneViewSource),
37+
render: () => ({
38+
Component: CustomSlotDropzoneView,
39+
}),
40+
};
41+
42+
export const DropZoneWithClickDisabled = {
43+
...sourceParameters(NoClickDropZoneViewSource),
44+
render: () => ({
45+
Component: NoClickDropZoneView,
46+
}),
47+
};
48+
49+
export const DropZoneWithDragDisabled = {
50+
...sourceParameters(NoDragDropzoneViewSource),
51+
render: () => ({
52+
Component: NoDragDropzoneView,
53+
}),
54+
};

‎stories/2-advanced-dropzone.stories.js

Lines changed: 16 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,27 @@
11
import { action } from "@storybook/addon-actions";
22

33
import WorkingCSVFileUploadView from "./views/WorkingCSVFileUploadView.svelte";
4+
import WorkingCSVFileUploadViewSource from "./views/WorkingCSVFileUploadView.svelte?raw";
45
import FullyFeaturedDropzoneView from "./views/FullyFeaturedDropzoneView.svelte";
6+
import FullyFeaturedDropzoneViewSource from "./views/FullyFeaturedDropzoneView.svelte?raw";
57

6-
import intro from "./../README.md";
8+
import { sourceParameters } from "./helpers";
79

810
export default {
911
title: "Advanced Examples",
10-
parameters: {
11-
notes: { Introduction: intro },
12-
},
12+
component: null,
1313
};
1414

15-
export const WorkingCSVFileUploadDropzone = () => ({
16-
Component: WorkingCSVFileUploadView,
17-
props: {},
18-
});
15+
export const WorkingCSVFileUploadDropzone = {
16+
...sourceParameters(WorkingCSVFileUploadViewSource),
17+
render: () => ({
18+
Component: WorkingCSVFileUploadView,
19+
}),
20+
};
1921

20-
export const FullyFeaturedImagesDropzone = () => ({
21-
Component: FullyFeaturedDropzoneView,
22-
props: {},
23-
});
22+
export const FullyFeaturedImagesDropzone = {
23+
...sourceParameters(FullyFeaturedDropzoneViewSource),
24+
render: () => ({
25+
Component: FullyFeaturedDropzoneView,
26+
}),
27+
};

‎stories/helpers.js

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export const sourceParameters = (source) => ({
2+
parameters: {
3+
docs: {
4+
source: {
5+
code: source,
6+
},
7+
},
8+
},
9+
});

‎stories/views/BasicDropzoneAcceptImagesView.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<script>
2-
import Dropzone from "./../../src";
2+
import Dropzone from "../../src/lib/components/Dropzone.svelte";
33
44
let files = {
55
accepted: [],
6-
rejected: []
6+
rejected: [],
77
};
88
99
function handleFilesSelect(e) {

‎stories/views/BasicDropzoneView.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<script>
2-
import Dropzone from "./../../src";
2+
import Dropzone from "../../src/lib/components/Dropzone.svelte";
33
44
let files = {
55
accepted: [],
6-
rejected: []
6+
rejected: [],
77
};
88
99
function handleFilesSelect(e) {

‎stories/views/CustomSlotDropzoneView.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<script>
2-
import Dropzone from "./../../src";
2+
import Dropzone from "../../src/lib/components/Dropzone.svelte";
33
44
let files = {
55
accepted: [],
6-
rejected: []
6+
rejected: [],
77
};
88
99
function handleFilesSelect(e) {

‎stories/views/DisabledDropzoneView.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<script>
2-
import Dropzone from "./../../src";
2+
import Dropzone from "../../src/lib/components/Dropzone.svelte";
33
44
let files = {
55
accepted: [],
6-
rejected: []
6+
rejected: [],
77
};
88
99
function handleFilesSelect(e) {

‎stories/views/FullyFeaturedDropzoneView.svelte

Lines changed: 9 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<script>
2-
import Dropzone from "./../../src";
2+
import Dropzone from "../../src/lib/components/Dropzone.svelte";
33
44
let files = {
55
accepted: [],
6-
rejected: []
6+
rejected: [],
77
};
88
99
function handleFilesSelect(e) {
@@ -21,15 +21,7 @@
2121
}
2222
</script>
2323

24-
<style>
25-
:global(.custom-dropzone) {
26-
}
27-
</style>
28-
29-
<Dropzone
30-
on:drop={handleFilesSelect}
31-
accept={['image/*']}
32-
containerClasses="custom-dropzone">
24+
<Dropzone on:drop={handleFilesSelect} accept={["image/*"]} containerClasses="custom-dropzone">
3325
<button>Choose images to upload</button>
3426

3527
<p>or</p>
@@ -42,7 +34,12 @@
4234
{#each files.accepted as item, index}
4335
<div>
4436
<span>{item.name}</span>
45-
<button on:click={e => handleRemoveFile(e, index)}>Remove</button>
37+
<button on:click={(e) => handleRemoveFile(e, index)}>Remove</button>
4638
</div>
4739
{/each}
4840
</div>
41+
42+
<style>
43+
:global(.custom-dropzone) {
44+
}
45+
</style>

‎stories/views/NoClickDropzoneView.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<script>
2-
import Dropzone from "./../../src";
2+
import Dropzone from "../../src/lib/components/Dropzone.svelte";
33
44
let files = {
55
accepted: [],
6-
rejected: []
6+
rejected: [],
77
};
88
99
function handleFilesSelect(e) {

‎stories/views/NoDragDropzoneView.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<script>
2-
import Dropzone from "./../../src";
2+
import Dropzone from "../../src/lib/components/Dropzone.svelte";
33
44
let files = {
55
accepted: [],
6-
rejected: []
6+
rejected: [],
77
};
88
99
function handleFilesSelect(e) {

‎stories/views/WorkingCSVFileUploadView.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script>
2-
import Dropzone from "./../../src";
2+
import Dropzone from "../../src/lib/components/Dropzone.svelte";
33
44
let files = [];
55
let fileData = [];

0 commit comments

Comments
 (0)