diff --git a/.prettierrc b/.prettierrc index ff2677efde55..30f3b752517b 100644 --- a/.prettierrc +++ b/.prettierrc @@ -2,5 +2,7 @@ "useTabs": true, "singleQuote": true, "trailingComma": "none", - "printWidth": 100 + "printWidth": 100, + "svelteSortOrder": "scripts-markup-styles", + "svelteBracketNewLine": true } diff --git a/examples/hn.svelte.dev/src/lib/PreloadingIndicator.svelte b/examples/hn.svelte.dev/src/lib/PreloadingIndicator.svelte index 0e2a029915e5..42b273355aeb 100644 --- a/examples/hn.svelte.dev/src/lib/PreloadingIndicator.svelte +++ b/examples/hn.svelte.dev/src/lib/PreloadingIndicator.svelte @@ -3,8 +3,8 @@ let p = 0; let visible = false; onMount(() => { + visible = true; function next() { - visible = true; p += 0.1; const remaining = 1 - p; if (remaining > 0.15) setTimeout(next, 500 / remaining); @@ -13,16 +13,6 @@ }); -{#if visible} -
-
-
-{/if} - -{#if p >= 0.4} -
-{/if} - \ No newline at end of file + + +{#if visible} +
+
+
+{/if} + +{#if p >= 0.4} +
+{/if} diff --git a/examples/realworld.svelte.dev/jsconfig.json b/examples/realworld.svelte.dev/jsconfig.json new file mode 100644 index 000000000000..266034f4f054 --- /dev/null +++ b/examples/realworld.svelte.dev/jsconfig.json @@ -0,0 +1,10 @@ +{ + "compilerOptions": { + "baseUrl": ".", + "paths": { + "$app/*": [".svelte/dev/runtime/app/*", ".svelte/build/runtime/app/*"], + "$lib/*": ["src/lib/*"] + } + }, + "include": ["src/**/*.d.ts", "src/**/*.js", "src/**/*.svelte"] +} diff --git a/examples/realworld.svelte.dev/package.json b/examples/realworld.svelte.dev/package.json index 16aa02ecd36d..dd1f1db5e126 100644 --- a/examples/realworld.svelte.dev/package.json +++ b/examples/realworld.svelte.dev/package.json @@ -15,6 +15,7 @@ "svelte": "^3.35.0" }, "dependencies": { + "cookie": "^0.4.1", "node-fetch": "^2.6.1" } } diff --git a/examples/realworld.svelte.dev/src/lib/ArticleList/ArticlePreview.svelte b/examples/realworld.svelte.dev/src/lib/ArticleList/ArticlePreview.svelte index ddc6b5bf5c4c..e88646e2c2d1 100644 --- a/examples/realworld.svelte.dev/src/lib/ArticleList/ArticlePreview.svelte +++ b/examples/realworld.svelte.dev/src/lib/ArticleList/ArticlePreview.svelte @@ -4,7 +4,7 @@ export let article; export let user; - async function toggleFavorite() { + async function toggle_favorite() { // optimistic UI if (article.favorited) { article.favoritesCount -= 1; @@ -22,37 +22,36 @@
- + {article.author.username}
- {article.author.username} - - - {new Date(article.createdAt).toDateString()} - + {article.author.username} + {new Date(article.createdAt).toDateString()}
{#if user}
-
{/if}
- +

{article.title}

{article.description}

Read more... -
\ No newline at end of file +
diff --git a/examples/realworld.svelte.dev/src/lib/ArticleList/ListPagination.svelte b/examples/realworld.svelte.dev/src/lib/ArticleList/ListPagination.svelte deleted file mode 100644 index 76a6b3bd7ef8..000000000000 --- a/examples/realworld.svelte.dev/src/lib/ArticleList/ListPagination.svelte +++ /dev/null @@ -1,26 +0,0 @@ - - -{#if articlesCount > 10} - -{/if} \ No newline at end of file diff --git a/examples/realworld.svelte.dev/src/lib/ArticleList/index.svelte b/examples/realworld.svelte.dev/src/lib/ArticleList/index.svelte index 99ff6a24b4af..aca1e097520f 100644 --- a/examples/realworld.svelte.dev/src/lib/ArticleList/index.svelte +++ b/examples/realworld.svelte.dev/src/lib/ArticleList/index.svelte @@ -1,53 +1,16 @@ -{#if articles} - {#if articles.length === 0} -
- No articles are here... yet. -
- {:else} -
- {#each articles as article (article.slug)} - - {/each} - - -
- {/if} +{#if articles.length === 0} +
No articles are here... yet.
{:else} -
Loading...
-{/if} \ No newline at end of file +
+ {#each articles as article (article.slug)} + + {/each} +
+{/if} diff --git a/examples/realworld.svelte.dev/src/lib/Home.svelte b/examples/realworld.svelte.dev/src/lib/Home.svelte deleted file mode 100644 index 17e2ae1cec19..000000000000 --- a/examples/realworld.svelte.dev/src/lib/Home.svelte +++ /dev/null @@ -1,47 +0,0 @@ - - - - Conduit - - -
- - -
-
- - -
-
-

Popular Tags

- -
-
-
-
-
\ No newline at end of file diff --git a/examples/realworld.svelte.dev/src/lib/MainView/index.svelte b/examples/realworld.svelte.dev/src/lib/MainView/index.svelte deleted file mode 100644 index df1ed7191155..000000000000 --- a/examples/realworld.svelte.dev/src/lib/MainView/index.svelte +++ /dev/null @@ -1,54 +0,0 @@ - - -
-
- -
- - -
\ No newline at end of file diff --git a/examples/realworld.svelte.dev/src/lib/Nav.svelte b/examples/realworld.svelte.dev/src/lib/Nav.svelte index 2b74d7c184b4..b7e614a8d6da 100644 --- a/examples/realworld.svelte.dev/src/lib/Nav.svelte +++ b/examples/realworld.svelte.dev/src/lib/Nav.svelte @@ -4,44 +4,52 @@ \ No newline at end of file + diff --git a/examples/realworld.svelte.dev/src/lib/Pagination.svelte b/examples/realworld.svelte.dev/src/lib/Pagination.svelte new file mode 100644 index 000000000000..87992c84e4a7 --- /dev/null +++ b/examples/realworld.svelte.dev/src/lib/Pagination.svelte @@ -0,0 +1,24 @@ + + +{#if pages > 1} + +{/if} diff --git a/examples/realworld.svelte.dev/src/lib/PreloadingIndicator.svelte b/examples/realworld.svelte.dev/src/lib/PreloadingIndicator.svelte new file mode 100644 index 000000000000..b869b6054aaa --- /dev/null +++ b/examples/realworld.svelte.dev/src/lib/PreloadingIndicator.svelte @@ -0,0 +1,67 @@ + + + + +{#if visible} +
+
+
+{/if} + +{#if p >= 0.4} +
+{/if} diff --git a/examples/realworld.svelte.dev/src/lib/Tags.svelte b/examples/realworld.svelte.dev/src/lib/Tags.svelte deleted file mode 100644 index ca165aa85427..000000000000 --- a/examples/realworld.svelte.dev/src/lib/Tags.svelte +++ /dev/null @@ -1,18 +0,0 @@ - - -{#if tags} -
- {#each tags as tag} - - {tag} - - {/each} -
-{:else} -
Loading Tags...
-{/if} \ No newline at end of file diff --git a/examples/realworld.svelte.dev/src/lib/actions.js b/examples/realworld.svelte.dev/src/lib/actions.js new file mode 100644 index 000000000000..7d22f8362189 --- /dev/null +++ b/examples/realworld.svelte.dev/src/lib/actions.js @@ -0,0 +1,28 @@ +const noop = () => {}; + +export function ajax(node, { onsubmit = noop, onresponse = noop } = {}) { + const handler = async (event) => { + event.preventDefault(); + const body = node.method === 'post' || node.method === 'put' ? new FormData(node) : null; + + onsubmit(body); + + const response = await fetch(node.action, { + method: node.method, + body, + headers: { + accept: 'application/json' + } + }); + + onresponse(response); + }; + + node.addEventListener('submit', handler); + + return { + destroy() { + node.removeEventListener('submit', handler); + } + }; +} diff --git a/examples/realworld.svelte.dev/src/lib/api.js b/examples/realworld.svelte.dev/src/lib/api.js index 610aaa4e4ec9..58b93be8dbd1 100644 --- a/examples/realworld.svelte.dev/src/lib/api.js +++ b/examples/realworld.svelte.dev/src/lib/api.js @@ -12,13 +12,14 @@ async function send({ method, path, data, token }) { opts.headers['Authorization'] = `Token ${token}`; } - const fetch = typeof window !== 'undefined' - ? window.fetch - : await import('node-fetch').then(mod => mod.default) + const fetch = + typeof window !== 'undefined' + ? window.fetch + : await import('node-fetch').then((mod) => mod.default); return fetch(`${base}/${path}`, opts) - .then(r => r.text()) - .then(json => { + .then((r) => r.text()) + .then((json) => { try { return JSON.parse(json); } catch (err) { @@ -41,4 +42,4 @@ export function post(path, data, token) { export function put(path, data, token) { return send({ method: 'PUT', path, data, token }); -} \ No newline at end of file +} diff --git a/examples/realworld.svelte.dev/src/lib/constants.js b/examples/realworld.svelte.dev/src/lib/constants.js new file mode 100644 index 000000000000..c126f48df643 --- /dev/null +++ b/examples/realworld.svelte.dev/src/lib/constants.js @@ -0,0 +1,2 @@ +export const page_size = 10; +export const placeholder = 'https://static.productionready.io/images/smiley-cyrus.jpg'; diff --git a/examples/realworld.svelte.dev/src/lib/utils.js b/examples/realworld.svelte.dev/src/lib/utils.js index 328d0505fff1..85316d5eae6c 100644 --- a/examples/realworld.svelte.dev/src/lib/utils.js +++ b/examples/realworld.svelte.dev/src/lib/utils.js @@ -2,9 +2,9 @@ export function post(endpoint, data) { return fetch(endpoint, { method: 'POST', credentials: 'include', - body: JSON.stringify(data), + body: JSON.stringify(data || {}), headers: { 'Content-Type': 'application/json' } - }).then(r => r.json()); -} \ No newline at end of file + }).then((r) => r.json()); +} diff --git a/examples/realworld.svelte.dev/src/routes/$error.svelte b/examples/realworld.svelte.dev/src/routes/$error.svelte index bca7ddf6389a..a920c4c41f5f 100644 --- a/examples/realworld.svelte.dev/src/routes/$error.svelte +++ b/examples/realworld.svelte.dev/src/routes/$error.svelte @@ -1,6 +1,5 @@ @@ -9,17 +8,15 @@ {status} - -
-

{status}

+
+

{status}

-

{error.message}

+

{error.message}

- {#if dev && error.stack} - 
{error.stack}
- {/if} -
- + {#if dev && error.stack} + 
{error.stack}
+ {/if} +
\ No newline at end of file + diff --git a/examples/realworld.svelte.dev/src/routes/$layout.svelte b/examples/realworld.svelte.dev/src/routes/$layout.svelte index 0147ad0c9c49..83ce71d23bf1 100644 --- a/examples/realworld.svelte.dev/src/routes/$layout.svelte +++ b/examples/realworld.svelte.dev/src/routes/$layout.svelte @@ -1,11 +1,15 @@ -
- {#if canModify} + {#if can_modify} Edit Article diff --git a/examples/realworld.svelte.dev/src/routes/article/[slug]/_Comment.svelte b/examples/realworld.svelte.dev/src/routes/article/[slug]/_Comment.svelte new file mode 100644 index 000000000000..f135152ebed9 --- /dev/null +++ b/examples/realworld.svelte.dev/src/routes/article/[slug]/_Comment.svelte @@ -0,0 +1,60 @@ + + +
+
+

{comment.body}

+
+ +
+ + {comment.author.username} + + + {comment.author.username} + + {new Date(comment.createdAt).toDateString()} + + {#if user && comment.author.username === user.username} +
+
+
+ + diff --git a/examples/realworld.svelte.dev/src/routes/article/[slug]/_CommentContainer.svelte b/examples/realworld.svelte.dev/src/routes/article/[slug]/_CommentContainer.svelte new file mode 100644 index 000000000000..19d809400092 --- /dev/null +++ b/examples/realworld.svelte.dev/src/routes/article/[slug]/_CommentContainer.svelte @@ -0,0 +1,36 @@ + + +
+ {#if user} +
+ (comments = [detail.comment, ...comments])} + /> +
+ {:else} +

+ Sign in + or + sign up + to add comments on this article. +

+ {/if} + + {#each comments as comment, i (comment.id)} + (comments = [...comments.slice(0, i), ...comments.slice(i + 1)])} + /> + {/each} +
diff --git a/examples/realworld.svelte.dev/src/routes/article/[slug]/_CommentInput.svelte b/examples/realworld.svelte.dev/src/routes/article/[slug]/_CommentInput.svelte new file mode 100644 index 000000000000..7b78034b13cc --- /dev/null +++ b/examples/realworld.svelte.dev/src/routes/article/[slug]/_CommentInput.svelte @@ -0,0 +1,52 @@ + + +
+
+