From 3fa7c28dcf3a52ccb78fe8b917c610095d874b2d Mon Sep 17 00:00:00 2001 From: Didier Catz Date: Fri, 30 Aug 2024 12:47:17 +0200 Subject: [PATCH] Initialize repo --- .gitignore | 21 + .npmrc | 1 + .prettierignore | 4 + .prettierrc | 16 + README.md | 38 ++ bun.lockb | Bin 0 -> 134988 bytes components.json | 14 + eslint.config.js | 33 ++ markdown_files/sveltejs-svelte/cache.json | 1 + .../docs/01-introduction/01-overview.md | 30 ++ .../01-introduction/02-getting-started.md | 39 ++ .../03-reactivity-fundamentals.md | 88 ++++ .../docs/01-introduction/index.md | 3 + .../01-component-fundamentals.md | 202 ++++++++ .../02-template-syntax/02-basic-markup.md | 218 +++++++++ .../02-template-syntax/03-control-flow.md | 148 ++++++ .../docs/02-template-syntax/04-snippets.md | 253 ++++++++++ .../05-styles-and-classes.md | 235 ++++++++++ .../06-transitions-and-animations.md | 432 ++++++++++++++++++ .../docs/02-template-syntax/07-actions.md | 103 +++++ .../docs/02-template-syntax/08-bindings.md | 305 +++++++++++++ .../02-template-syntax/09-special-elements.md | 192 ++++++++ .../02-template-syntax/10-data-fetching.md | 85 ++++ .../docs/02-template-syntax/index.md | 3 + .../sveltejs-svelte/docs/03-runes/01-state.md | 201 ++++++++ .../docs/03-runes/02-side-effects.md | 377 +++++++++++++++ .../sveltejs-svelte/docs/03-runes/index.md | 3 + .../docs/04-runtime/01-stores.md | 285 ++++++++++++ .../docs/04-runtime/02-context.md | 131 ++++++ .../docs/04-runtime/03-lifecycle-hooks.md | 172 +++++++ .../04-runtime/04-imperative-component-api.md | 80 ++++ .../sveltejs-svelte/docs/04-runtime/index.md | 3 + .../docs/05-misc/01-debugging.md | 94 ++++ .../docs/05-misc/02-testing.md | 218 +++++++++ .../docs/05-misc/03-typescript.md | 241 ++++++++++ .../docs/05-misc/04-custom-elements.md | 125 +++++ .../docs/05-misc/05-reactivity-indepth.md | 6 + .../05-misc/06-svelte-5-migration-guide.md | 5 + .../sveltejs-svelte/docs/05-misc/index.md | 3 + .../docs/98-reference/01-state.md | 9 + .../docs/98-reference/20-svelte.md | 5 + .../docs/98-reference/21-svelte-action.md | 5 + .../docs/98-reference/21-svelte-animate.md | 5 + .../docs/98-reference/21-svelte-compiler.md | 5 + .../docs/98-reference/21-svelte-easing.md | 5 + .../docs/98-reference/21-svelte-events.md | 5 + .../docs/98-reference/21-svelte-legacy.md | 5 + .../docs/98-reference/21-svelte-motion.md | 5 + .../docs/98-reference/21-svelte-reactivity.md | 5 + .../docs/98-reference/21-svelte-server.md | 5 + .../docs/98-reference/21-svelte-store.md | 5 + .../docs/98-reference/21-svelte-transition.md | 5 + .../docs/98-reference/index.md | 3 + markdown_files/sveltejs-svelte/docs/index.md | 3 + package.json | 45 ++ postcss.config.js | 6 + src/app.css | 78 ++++ src/app.d.ts | 13 + src/app.html | 12 + src/lib/checkReleases.ts | 39 ++ src/lib/components/ui/button/button.svelte | 25 + src/lib/components/ui/button/index.ts | 48 ++ src/lib/index.ts | 1 + src/lib/utils.ts | 56 +++ src/routes/+layout.svelte | 18 + src/routes/+layout.ts | 1 + src/routes/+page.svelte | 2 + src/routes/[preset]/+server.ts | 161 +++++++ src/routes/webhook/+server.ts | 32 ++ static/favicon.png | Bin 0 -> 1571 bytes svelte.config.js | 18 + tailwind.config.ts | 64 +++ tsconfig.json | 19 + vite.config.ts | 11 + 74 files changed, 5132 insertions(+) create mode 100644 .gitignore create mode 100644 .npmrc create mode 100644 .prettierignore create mode 100644 .prettierrc create mode 100644 README.md create mode 100755 bun.lockb create mode 100644 components.json create mode 100644 eslint.config.js create mode 100644 markdown_files/sveltejs-svelte/cache.json create mode 100644 markdown_files/sveltejs-svelte/docs/01-introduction/01-overview.md create mode 100644 markdown_files/sveltejs-svelte/docs/01-introduction/02-getting-started.md create mode 100644 markdown_files/sveltejs-svelte/docs/01-introduction/03-reactivity-fundamentals.md create mode 100644 markdown_files/sveltejs-svelte/docs/01-introduction/index.md create mode 100644 markdown_files/sveltejs-svelte/docs/02-template-syntax/01-component-fundamentals.md create mode 100644 markdown_files/sveltejs-svelte/docs/02-template-syntax/02-basic-markup.md create mode 100644 markdown_files/sveltejs-svelte/docs/02-template-syntax/03-control-flow.md create mode 100644 markdown_files/sveltejs-svelte/docs/02-template-syntax/04-snippets.md create mode 100644 markdown_files/sveltejs-svelte/docs/02-template-syntax/05-styles-and-classes.md create mode 100644 markdown_files/sveltejs-svelte/docs/02-template-syntax/06-transitions-and-animations.md create mode 100644 markdown_files/sveltejs-svelte/docs/02-template-syntax/07-actions.md create mode 100644 markdown_files/sveltejs-svelte/docs/02-template-syntax/08-bindings.md create mode 100644 markdown_files/sveltejs-svelte/docs/02-template-syntax/09-special-elements.md create mode 100644 markdown_files/sveltejs-svelte/docs/02-template-syntax/10-data-fetching.md create mode 100644 markdown_files/sveltejs-svelte/docs/02-template-syntax/index.md create mode 100644 markdown_files/sveltejs-svelte/docs/03-runes/01-state.md create mode 100644 markdown_files/sveltejs-svelte/docs/03-runes/02-side-effects.md create mode 100644 markdown_files/sveltejs-svelte/docs/03-runes/index.md create mode 100644 markdown_files/sveltejs-svelte/docs/04-runtime/01-stores.md create mode 100644 markdown_files/sveltejs-svelte/docs/04-runtime/02-context.md create mode 100644 markdown_files/sveltejs-svelte/docs/04-runtime/03-lifecycle-hooks.md create mode 100644 markdown_files/sveltejs-svelte/docs/04-runtime/04-imperative-component-api.md create mode 100644 markdown_files/sveltejs-svelte/docs/04-runtime/index.md create mode 100644 markdown_files/sveltejs-svelte/docs/05-misc/01-debugging.md create mode 100644 markdown_files/sveltejs-svelte/docs/05-misc/02-testing.md create mode 100644 markdown_files/sveltejs-svelte/docs/05-misc/03-typescript.md create mode 100644 markdown_files/sveltejs-svelte/docs/05-misc/04-custom-elements.md create mode 100644 markdown_files/sveltejs-svelte/docs/05-misc/05-reactivity-indepth.md create mode 100644 markdown_files/sveltejs-svelte/docs/05-misc/06-svelte-5-migration-guide.md create mode 100644 markdown_files/sveltejs-svelte/docs/05-misc/index.md create mode 100644 markdown_files/sveltejs-svelte/docs/98-reference/01-state.md create mode 100644 markdown_files/sveltejs-svelte/docs/98-reference/20-svelte.md create mode 100644 markdown_files/sveltejs-svelte/docs/98-reference/21-svelte-action.md create mode 100644 markdown_files/sveltejs-svelte/docs/98-reference/21-svelte-animate.md create mode 100644 markdown_files/sveltejs-svelte/docs/98-reference/21-svelte-compiler.md create mode 100644 markdown_files/sveltejs-svelte/docs/98-reference/21-svelte-easing.md create mode 100644 markdown_files/sveltejs-svelte/docs/98-reference/21-svelte-events.md create mode 100644 markdown_files/sveltejs-svelte/docs/98-reference/21-svelte-legacy.md create mode 100644 markdown_files/sveltejs-svelte/docs/98-reference/21-svelte-motion.md create mode 100644 markdown_files/sveltejs-svelte/docs/98-reference/21-svelte-reactivity.md create mode 100644 markdown_files/sveltejs-svelte/docs/98-reference/21-svelte-server.md create mode 100644 markdown_files/sveltejs-svelte/docs/98-reference/21-svelte-store.md create mode 100644 markdown_files/sveltejs-svelte/docs/98-reference/21-svelte-transition.md create mode 100644 markdown_files/sveltejs-svelte/docs/98-reference/index.md create mode 100644 markdown_files/sveltejs-svelte/docs/index.md create mode 100644 package.json create mode 100644 postcss.config.js create mode 100644 src/app.css create mode 100644 src/app.d.ts create mode 100644 src/app.html create mode 100644 src/lib/checkReleases.ts create mode 100644 src/lib/components/ui/button/button.svelte create mode 100644 src/lib/components/ui/button/index.ts create mode 100644 src/lib/index.ts create mode 100644 src/lib/utils.ts create mode 100644 src/routes/+layout.svelte create mode 100644 src/routes/+layout.ts create mode 100644 src/routes/+page.svelte create mode 100644 src/routes/[preset]/+server.ts create mode 100644 src/routes/webhook/+server.ts create mode 100644 static/favicon.png create mode 100644 svelte.config.js create mode 100644 tailwind.config.ts create mode 100644 tsconfig.json create mode 100644 vite.config.ts diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..79518f7 --- /dev/null +++ b/.gitignore @@ -0,0 +1,21 @@ +node_modules + +# Output +.output +.vercel +/.svelte-kit +/build + +# OS +.DS_Store +Thumbs.db + +# Env +.env +.env.* +!.env.example +!.env.test + +# Vite +vite.config.js.timestamp-* +vite.config.ts.timestamp-* diff --git a/.npmrc b/.npmrc new file mode 100644 index 0000000..b6f27f1 --- /dev/null +++ b/.npmrc @@ -0,0 +1 @@ +engine-strict=true diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 0000000..ab78a95 --- /dev/null +++ b/.prettierignore @@ -0,0 +1,4 @@ +# Package Managers +package-lock.json +pnpm-lock.yaml +yarn.lock diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..f8200bd --- /dev/null +++ b/.prettierrc @@ -0,0 +1,16 @@ +{ + "useTabs": true, + "semi": false, + "singleQuote": true, + "trailingComma": "none", + "printWidth": 100, + "plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"], + "overrides": [ + { + "files": "*.svelte", + "options": { + "parser": "svelte" + } + } + ] +} diff --git a/README.md b/README.md new file mode 100644 index 0000000..5ce6766 --- /dev/null +++ b/README.md @@ -0,0 +1,38 @@ +# create-svelte + +Everything you need to build a Svelte project, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/main/packages/create-svelte). + +## Creating a project + +If you're seeing this, you've probably already done this step. Congrats! + +```bash +# create a new project in the current directory +npm create svelte@latest + +# create a new project in my-app +npm create svelte@latest my-app +``` + +## Developing + +Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server: + +```bash +npm run dev + +# or start the server and open the app in a new browser tab +npm run dev -- --open +``` + +## Building + +To create a production version of your app: + +```bash +npm run build +``` + +You can preview the production build with `npm run preview`. + +> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment. diff --git a/bun.lockb b/bun.lockb new file mode 100755 index 0000000000000000000000000000000000000000..4239b86de379588c31f3239d231c5ca238c58e75 GIT binary patch literal 134988 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 F{|79yUgQ7( literal 0 HcmV?d00001 diff --git a/components.json b/components.json new file mode 100644 index 0000000..ce35209 --- /dev/null +++ b/components.json @@ -0,0 +1,14 @@ +{ + "$schema": "https://shadcn-svelte.com/schema.json", + "style": "default", + "tailwind": { + "config": "tailwind.config.ts", + "css": "src/app.css", + "baseColor": "stone" + }, + "aliases": { + "components": "$lib/components", + "utils": "$lib/utils" + }, + "typescript": true +} diff --git a/eslint.config.js b/eslint.config.js new file mode 100644 index 0000000..426c4a7 --- /dev/null +++ b/eslint.config.js @@ -0,0 +1,33 @@ +import js from '@eslint/js' +import ts from 'typescript-eslint' +import svelte from 'eslint-plugin-svelte' +import prettier from 'eslint-config-prettier' +import globals from 'globals' + +/** @type {import('eslint').Linter.Config[]} */ +export default [ + js.configs.recommended, + ...ts.configs.recommended, + ...svelte.configs['flat/recommended'], + prettier, + ...svelte.configs['flat/prettier'], + { + languageOptions: { + globals: { + ...globals.browser, + ...globals.node + } + } + }, + { + files: ['**/*.svelte'], + languageOptions: { + parserOptions: { + parser: ts.parser + } + } + }, + { + ignores: ['build/', '.svelte-kit/', 'dist/'] + } +] diff --git a/markdown_files/sveltejs-svelte/cache.json b/markdown_files/sveltejs-svelte/cache.json new file mode 100644 index 0000000..08ab8f3 --- /dev/null +++ b/markdown_files/sveltejs-svelte/cache.json @@ -0,0 +1 @@ +{"content":"--- title: Overview --- - Short intro to what Svelte is and why it's the best ever - A few code examples to have a very rough understanding of how Svelte code looks like - Jump off points to tutorial, SvelteKit etc Svelte is a web UI framework that uses a compiler to turn declarative component code like this... ...into tightly optimized JavaScript that updates the document when state like count changes. Because the compiler can 'see' where count is referenced, the generated code is highly efficient, and because we're hijacking syntax like `$state` and `=` instead of using cumbersome APIs, you can write less code. Besides being fun to work with, Svelte offers a lot of features built-in, such as animations and transitions. Once you've written your first components you can reach for our batteries included metaframework which provides you with an opinionated router, data loading and more. If you're new to Svelte, visit the before consulting this documentation. You can try Svelte online using the . Alternatively, if you'd like a more fully-featured environment, you can try Svelte on . --- title: Getting started --- - `npm create svelte@latest`, describe that it scaffolds SvelteKit project - `npm create vite@latest`, describe that it scaffolds Svelte SPA powered by Vite - mention `svelte-add` - Jump off points to tutorial, SvelteKit etc ## Start a new project We recommend using , the official application framework from the Svelte team: SvelteKit will handle calling to convert your `.svelte` files into `.js` files that create the DOM and `.css` files that style it. It also provides all the other pieces you need to build a web application such as a development server, routing, deployment, and SSR support. uses to build your code. Don't worry if you don't know Svelte yet! You can ignore all the nice features SvelteKit brings on top for now and dive into it later. ### Alternatives to SvelteKit If you don't want to use SvelteKit for some reason, you can also use Svelte with Vite by running `npm create vite@latest` and selecting the `svelte` option. With this, `npm run build` will generate HTML, JS and CSS files inside the `dist` directory thanks using . In most cases, you will probably need to as well. Alternatively, there are plugins for , to handle Svelte compilation — which will output `.js` and `.css` that you can insert into your HTML — but setting up SSR with them requires more manual work. ## Editor tooling The Svelte team maintains a and there are integrations with various other and tools as well. You can also check your code from the command line using . ## Getting help Don't be shy about asking for help in the ! You can also find answers on . --- title: Reactivity fundamentals --- Reactivity is at the heart of interactive UIs. When you click a button, you expect some kind of response. It's your job as a developer to make this happen. It's Svelte's job to make your job as intuitive as possible, by providing a good API to express reactive systems. ## Runes Svelte 5 uses _runes_, a powerful set of primitives for controlling reactivity inside your Svelte components and inside `.svelte.js` and `.svelte.ts` modules. Runes are function-like symbols that provide instructions to the Svelte compiler. You don't need to import them from anywhere — when you use Svelte, they're part of the language. The following sections introduce the most important runes for declare state, derived state and side effects at a high level. For more details refer to the later sections on and . ## `$state` Reactive state is declared with the `$state` rune: You can also use `$state` in class fields : ## `$derived` Derived state is declared with the `$derived` rune: The expression inside `$derived` should be free of side-effects. Svelte will disallow state changes inside derived expressions. As with `$state`, you can mark class fields as `$derived`. ## `$effect` To run _side-effects_ when the component is mounted to the DOM, and when values change, we can use the `$effect` rune ): The function passed to `$effect` will run when the component mounts, and will re-run after any changes to the values it reads that were declared with `$state` or `$derived` . Re-runs are batched , and happen after any DOM updates have been applied. --- title: Introduction --- --- title: Component fundamentals --- - script / template / style - `$props` / `$state` Components are the building blocks of Svelte applications. They are written into `.svelte` files, using a superset of HTML. All three sections — script, styles and markup — are optional. ## <script> A ` + + +``` + +...into tightly optimized JavaScript that updates the document when state like count changes. Because the compiler can 'see' where count is referenced, the generated code is highly efficient, and because we're hijacking syntax like `$state(...)` and `=` instead of using cumbersome APIs, you can write less code. + +Besides being fun to work with, Svelte offers a lot of features built-in, such as animations and transitions. Once you've written your first components you can reach for our batteries included metaframework [SvelteKit](/docs/kit) which provides you with an opinionated router, data loading and more. + +If you're new to Svelte, visit the [interactive tutorial](/tutorial) before consulting this documentation. You can try Svelte online using the [REPL](/repl). Alternatively, if you'd like a more fully-featured environment, you can try Svelte on [StackBlitz](https://sveltekit.new). diff --git a/markdown_files/sveltejs-svelte/docs/01-introduction/02-getting-started.md b/markdown_files/sveltejs-svelte/docs/01-introduction/02-getting-started.md new file mode 100644 index 0000000..0f896ab --- /dev/null +++ b/markdown_files/sveltejs-svelte/docs/01-introduction/02-getting-started.md @@ -0,0 +1,39 @@ +--- +title: Getting started +--- + +- `npm create svelte@latest`, describe that it scaffolds SvelteKit project +- `npm create vite@latest`, describe that it scaffolds Svelte SPA powered by Vite +- mention `svelte-add` +- Jump off points to tutorial, SvelteKit etc + +## Start a new project + +We recommend using [SvelteKit](https://kit.svelte.dev/), the official application framework from the Svelte team: + +``` +npm create svelte@latest myapp +cd myapp +npm install +npm run dev +``` + +SvelteKit will handle calling [the Svelte compiler](https://www.npmjs.com/package/svelte) to convert your `.svelte` files into `.js` files that create the DOM and `.css` files that style it. It also provides all the other pieces you need to build a web application such as a development server, routing, deployment, and SSR support. [SvelteKit](https://kit.svelte.dev/) uses [Vite](https://vitejs.dev/) to build your code. + +Don't worry if you don't know Svelte yet! You can ignore all the nice features SvelteKit brings on top for now and dive into it later. + +### Alternatives to SvelteKit + +If you don't want to use SvelteKit for some reason, you can also use Svelte with Vite (but without SvelteKit) by running `npm create vite@latest` and selecting the `svelte` option. With this, `npm run build` will generate HTML, JS and CSS files inside the `dist` directory thanks using [vite-plugin-svelte](https://github.com/sveltejs/vite-plugin-svelte). In most cases, you will probably need to [choose a routing library](faq#is-there-a-router) as well. + +Alternatively, there are plugins for [Rollup](https://github.com/sveltejs/rollup-plugin-svelte), [Webpack](https://github.com/sveltejs/svelte-loader) [and a few others](https://sveltesociety.dev/packages?category=build-plugins) to handle Svelte compilation — which will output `.js` and `.css` that you can insert into your HTML — but setting up SSR with them requires more manual work. + +## Editor tooling + +The Svelte team maintains a [VS Code extension](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode) and there are integrations with various other [editors](https://sveltesociety.dev/resources#editor-support) and tools as well. + +You can also check your code from the command line using [svelte-check](https://www.npmjs.com/package/svelte-check) (using the Svelte or Vite CLI setup will install this for you). + +## Getting help + +Don't be shy about asking for help in the [Discord chatroom](https://svelte.dev/chat)! You can also find answers on [Stack Overflow](https://stackoverflow.com/questions/tagged/svelte). diff --git a/markdown_files/sveltejs-svelte/docs/01-introduction/03-reactivity-fundamentals.md b/markdown_files/sveltejs-svelte/docs/01-introduction/03-reactivity-fundamentals.md new file mode 100644 index 0000000..0f1c8e0 --- /dev/null +++ b/markdown_files/sveltejs-svelte/docs/01-introduction/03-reactivity-fundamentals.md @@ -0,0 +1,88 @@ +--- +title: Reactivity fundamentals +--- + +Reactivity is at the heart of interactive UIs. When you click a button, you expect some kind of response. It's your job as a developer to make this happen. It's Svelte's job to make your job as intuitive as possible, by providing a good API to express reactive systems. + +## Runes + +Svelte 5 uses _runes_, a powerful set of primitives for controlling reactivity inside your Svelte components and inside `.svelte.js` and `.svelte.ts` modules. + +Runes are function-like symbols that provide instructions to the Svelte compiler. You don't need to import them from anywhere — when you use Svelte, they're part of the language. + +The following sections introduce the most important runes for declare state, derived state and side effects at a high level. For more details refer to the later sections on [state](/docs/svelte/runes/state) and [side effects](/docs/svelte/runes/side-effects). + +## `$state` + +Reactive state is declared with the `$state` rune: + +```svelte + + + +``` + +You can also use `$state` in class fields (whether public or private): + +```js +// @errors: 7006 2554 +class Todo { + done = $state(false); + text = $state(); + + constructor(text) { + this.text = text; + } +} +``` + +## `$derived` + +Derived state is declared with the `$derived` rune: + +```svelte + + + + +

{count} doubled is {doubled}

+``` + +The expression inside `$derived(...)` should be free of side-effects. Svelte will disallow state changes (e.g. `count++`) inside derived expressions. + +As with `$state`, you can mark class fields as `$derived`. + +## `$effect` + +To run _side-effects_ when the component is mounted to the DOM, and when values change, we can use the `$effect` rune ([demo](/#H4sIAAAAAAAAE31T24rbMBD9lUG7kAQ2sbdlX7xOYNk_aB_rQhRpbAsU2UiTW0P-vbrYubSlYGzmzMzROTPymdVKo2PFjzMzfIusYB99z14YnfoQuD1qQh-7bmdFQEonrOppVZmKNBI49QthCc-OOOH0LZ-9jxnR6c7eUpOnuv6KeT5JFdcqbvbcBcgDz1jXKGg6ncFyBedYR6IzLrAZwiN5vtSxaJA-EzadfJEjKw11C6GR22-BLH8B_wxdByWpvUYtqqal2XB6RVkG1CoHB6U1WJzbnYFDiwb3aGEdDa3Bm1oH12sQLTcNPp7r56m_00mHocSG97_zd7ICUXonA5fwKbPbkE2ZtMJGGVkEdctzQi4QzSwr9prnFYNk5hpmqVuqPQjNnfOJoMF22lUsrq_UfIN6lfSVyvQ7grB3X2mjMZYO3XO9w-U5iLx42qg29md3BP_ni5P4gy9ikTBlHxjLzAtPDlyYZmRdjAbGq7HprEQ7p64v4LU_guu0kvAkhBim3nMplWl8FreQD-CW20aZR0wq12t-KqDWeBywhvexKC3memmDwlHAv9q4Vo2ZK8KtK0CgX7u9J8wXbzdKv-nRnfF_2baTqlYoWUF2h5efl9-n0O6koAMAAA==)): + +```svelte + + + +``` + +The function passed to `$effect` will run when the component mounts, and will re-run after any changes to the values it reads that were declared with `$state` or `$derived` (including those passed in with `$props`). Re-runs are batched (i.e. changing `color` and `size` in the same moment won't cause two separate runs), and happen after any DOM updates have been applied. diff --git a/markdown_files/sveltejs-svelte/docs/01-introduction/index.md b/markdown_files/sveltejs-svelte/docs/01-introduction/index.md new file mode 100644 index 0000000..8f14f7a --- /dev/null +++ b/markdown_files/sveltejs-svelte/docs/01-introduction/index.md @@ -0,0 +1,3 @@ +--- +title: Introduction +--- diff --git a/markdown_files/sveltejs-svelte/docs/02-template-syntax/01-component-fundamentals.md b/markdown_files/sveltejs-svelte/docs/02-template-syntax/01-component-fundamentals.md new file mode 100644 index 0000000..fc81bb2 --- /dev/null +++ b/markdown_files/sveltejs-svelte/docs/02-template-syntax/01-component-fundamentals.md @@ -0,0 +1,202 @@ +--- +title: Component fundamentals +--- + +- script (module) / template / style (rough overview) +- `$props` / `$state` (in the context of components) + +Components are the building blocks of Svelte applications. They are written into `.svelte` files, using a superset of HTML. + +All three sections — script, styles and markup — are optional. + +```svelte + + + + + +``` + +## <script> + +A ` +``` + +You can specify a fallback value for a prop. It will be used if the component's consumer doesn't specify the prop on the component when instantiating the component, or if the passed value is `undefined` at some point. + +```svelte + +``` + +To get all properties, use rest syntax: + +```svelte + +``` + +You can use reserved words as prop names. + +```svelte + +``` + +If you're using TypeScript, you can declare the prop types: + +```svelte + +``` + +If you're using JavaScript, you can declare the prop types using JSDoc: + +```svelte + +``` + +If you export a `const`, `class` or `function`, it is readonly from outside the component. + +```svelte + +``` + +Readonly props can be accessed as properties on the element, tied to the component using [`bind:this` syntax](/docs/component-directives#bind-this). + +### Reactive variables + +To change component state and trigger a re-render, just assign to a locally declared variable that was declared using the `$state` rune. + +Update expressions (`count += 1`) and property assignments (`obj.x = y`) have the same effect. + +```svelte + +``` + +Svelte's ` +``` + +If you'd like to react to changes to a prop, use the `$derived` or `$effect` runes instead. + +```svelte + +``` + +For more information on reactivity, read the documentation around runes. + +## <script module> + +A ` + + +``` + +## <style> + +CSS inside a ` +``` + +For more information regarding styling, read the documentation around [styles and classes](styles-and-classes). diff --git a/markdown_files/sveltejs-svelte/docs/02-template-syntax/02-basic-markup.md b/markdown_files/sveltejs-svelte/docs/02-template-syntax/02-basic-markup.md new file mode 100644 index 0000000..8bf9b2c --- /dev/null +++ b/markdown_files/sveltejs-svelte/docs/02-template-syntax/02-basic-markup.md @@ -0,0 +1,218 @@ +--- +title: Basic markup +--- + +- [basically what we have in the Svelte docs today](https://svelte.dev/docs/basic-markup) + +## Tags + +A lowercase tag, like `
`, denotes a regular HTML element. A capitalised tag, such as `` or ``, indicates a _component_. + +```svelte + + +
+ +
+``` + +## Attributes and props + +By default, attributes work exactly like their HTML counterparts. + +```svelte +
+ +
+``` + +As in HTML, values may be unquoted. + + +```svelte + +``` + +Attribute values can contain JavaScript expressions. + +```svelte +page {p} +``` + +Or they can _be_ JavaScript expressions. + +```svelte + +``` + +Boolean attributes are included on the element if their value is [truthy](https://developer.mozilla.org/en-US/docs/Glossary/Truthy) and excluded if it's [falsy](https://developer.mozilla.org/en-US/docs/Glossary/Falsy). + +All other attributes are included unless their value is [nullish](https://developer.mozilla.org/en-US/docs/Glossary/Nullish) (`null` or `undefined`). + +```svelte + +
This div has no title attribute
+``` + +Quoting a singular expression does not affect how the value is parsed yet, but in Svelte 6 it will: + + +```svelte + +``` + +When the attribute name and value match (`name={name}`), they can be replaced with `{name}`. + +```svelte + + +``` + +By convention, values passed to components are referred to as _properties_ or _props_ rather than _attributes_, which are a feature of the DOM. + +As with elements, `name={name}` can be replaced with the `{name}` shorthand. + +```svelte + +``` + +_Spread attributes_ allow many attributes or properties to be passed to an element or component at once. + +An element or component can have multiple spread attributes, interspersed with regular ones. + +```svelte + +``` + +> The `value` attribute of an `input` element or its children `option` elements must not be set with spread attributes when using `bind:group` or `bind:checked`. Svelte needs to be able to see the element's `value` directly in the markup in these cases so that it can link it to the bound variable. + +> Sometimes, the attribute order matters as Svelte sets attributes sequentially in JavaScript. For example, ``, Svelte will attempt to set the value to `1` (rounding up from 0.5 as the step by default is 1), and then set the step to `0.1`. To fix this, change it to ``. + +> Another example is ``. Svelte will set the img `src` before making the img element `loading="lazy"`, which is probably too late. Change this to `` to make the image lazily loaded. + +## Events + +Listening to DOM events is possible by adding attributes to the element that start with `on`. For example, to listen to the `click` event, add the `onclick` attribute to a button: + +```svelte + +``` + +Event attributes are case sensitive. `onclick` listens to the `click` event, `onClick` listens to the `Click` event, which is different. This ensures you can listen to custom events that have uppercase characters in them. + +Because events are just attributes, the same rules as for attributes apply: + +- you can use the shorthand form: `` +- you can spread them: `` +- component events are just (callback) properties and don't need a separate concept + +Timing-wise, event attributes always fire after events from bindings (e.g. `oninput` always fires after an update to `bind:value`). Under the hood, some event handlers are attached directly with `addEventListener`, while others are _delegated_. + +When using `onwheel`, `onmousewheel`, `ontouchstart` and `ontouchmove` event attributes, the handlers are [passive](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#using_passive_listeners) to align with browser defaults. This greatly improves responsiveness by allowing the browser to scroll the document immediately, rather than waiting to see if the event handler calls `event.preventDefault()`. + +In the very rare cases that you need to prevent these event defaults, you should use [`on`](https://svelte-5-preview.vercel.app/docs/imports#svelte-events) instead (for example inside an action). + +### Event delegation + +To reduce memory footprint and increase performance, Svelte uses a technique called event delegation. This means that for certain events — see the list below — a single event listener at the application root takes responsibility for running any handlers on the event's path. + +There are a few gotchas to be aware of: + +- when you manually dispatch an event with a delegated listener, make sure to set the `{ bubbles: true }` option or it won't reach the application root +- when using `addEventListener` directly, avoid calling `stopPropagation` or the event won't reach the application root and handlers won't be invoked. Similarly, handlers added manually inside the application root will run _before_ handlers added declaratively deeper in the DOM (with e.g. `onclick={...}`), in both capturing and bubbling phases. For these reasons it's better to use the `on` function imported from `svelte/events` rather than `addEventListener`, as it will ensure that order is preserved and `stopPropagation` is handled correctly. + +The following event handlers are delegated: + +- `beforeinput` +- `click` +- `change` +- `dblclick` +- `contextmenu` +- `focusin` +- `focusout` +- `input` +- `keydown` +- `keyup` +- `mousedown` +- `mousemove` +- `mouseout` +- `mouseover` +- `mouseup` +- `pointerdown` +- `pointermove` +- `pointerout` +- `pointerover` +- `pointerup` +- `touchend` +- `touchmove` +- `touchstart` + +## Text expressions + +A JavaScript expression can be included as text by surrounding it with curly braces. + +```svelte +{expression} +``` + +Curly braces can be included in a Svelte template by using their [HTML entity](https://developer.mozilla.org/docs/Glossary/Entity) strings: `{`, `{`, or `{` for `{` and `}`, `}`, or `}` for `}`. + +If you're using a regular expression (`RegExp`) [literal notation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp#literal_notation_and_constructor), you'll need to wrap it in parentheses. + + +```svelte +

Hello {name}!

+

{a} + {b} = {a + b}.

+ +
{(/^[A-Za-z ]+$/).test(value) ? x : y}
+``` + +The expression will be stringified and escaped to prevent code injections. If you want to render HTML, use the `{@html}` tag instead. + +```svelte +{@html potentiallyUnsafeHtmlString} +``` + +> Make sure that you either escape the passed string or only populate it with values that are under your control in order to prevent [XSS attacks](https://owasp.org/www-community/attacks/xss/) + +## Comments + +You can use HTML comments inside components. + +```svelte +

Hello world

+``` + +Comments beginning with `svelte-ignore` disable warnings for the next block of markup. Usually, these are accessibility warnings; make sure that you're disabling them for a good reason. + +```svelte + + +``` + +You can add a special comment starting with `@component` that will show up when hovering over the component name in other files. + +````svelte + + + +
+

+ Hello, {name} +

+
+```` diff --git a/markdown_files/sveltejs-svelte/docs/02-template-syntax/03-control-flow.md b/markdown_files/sveltejs-svelte/docs/02-template-syntax/03-control-flow.md new file mode 100644 index 0000000..84c4456 --- /dev/null +++ b/markdown_files/sveltejs-svelte/docs/02-template-syntax/03-control-flow.md @@ -0,0 +1,148 @@ +--- +title: Control flow +--- + +- if +- each +- await (or move that into some kind of data loading section?) +- NOT: key (move into transition section, because that's the common use case) + +Svelte augments HTML with control flow blocks to be able to express conditionally rendered content or lists. + +The syntax between these blocks is the same: + +- `{#` denotes the start of a block +- `{:` denotes a different branch part of the block. Depending on the block, there can be multiple of these +- `{/` denotes the end of a block + +## {#if ...} + +```svelte + +{#if expression}...{/if} +``` + +```svelte + +{#if expression}...{:else if expression}...{/if} +``` + +```svelte + +{#if expression}...{:else}...{/if} +``` + +Content that is conditionally rendered can be wrapped in an if block. + +```svelte +{#if answer === 42} +

what was the question?

+{/if} +``` + +Additional conditions can be added with `{:else if expression}`, optionally ending in an `{:else}` clause. + +```svelte +{#if porridge.temperature > 100} +

too hot!

+{:else if 80 > porridge.temperature} +

too cold!

+{:else} +

just right!

+{/if} +``` + +(Blocks don't have to wrap elements, they can also wrap text within elements!) + +## {#each ...} + +```svelte + +{#each expression as name}...{/each} +``` + +```svelte + +{#each expression as name, index}...{/each} +``` + +```svelte + +{#each expression as name (key)}...{/each} +``` + +```svelte + +{#each expression as name, index (key)}...{/each} +``` + +```svelte + +{#each expression as name}...{:else}...{/each} +``` + +Iterating over lists of values can be done with an each block. + +```svelte +

Shopping list

+
    + {#each items as item} +
  • {item.name} x {item.qty}
    • + {/each} +
+``` + +You can use each blocks to iterate over any array or array-like value — that is, any object with a `length` property. + +An each block can also specify an _index_, equivalent to the second argument in an `array.map(...)` callback: + +```svelte +{#each items as item, i} +
  • {i + 1}: {item.name} x {item.qty}
    • +{/each} +``` + +If a _key_ expression is provided — which must uniquely identify each list item — Svelte will use it to diff the list when data changes, rather than adding or removing items at the end. The key can be any object, but strings and numbers are recommended since they allow identity to persist when the objects themselves change. + +```svelte +{#each items as item (item.id)} +
  • {item.name} x {item.qty}
    • +{/each} + + +{#each items as item, i (item.id)} +
  • {i + 1}: {item.name} x {item.qty}
    • +{/each} +``` + +You can freely use destructuring and rest patterns in each blocks. + +```svelte +{#each items as { id, name, qty }, i (id)} +
  • {i + 1}: {name} x {qty}
    • +{/each} + +{#each objects as { id, ...rest }} +
  • {id}
    • +{/each} + +{#each items as [id, ...rest]} +
  • {id}
    • +{/each} +``` + +An each block can also have an `{:else}` clause, which is rendered if the list is empty. + +```svelte +{#each todos as todo} +

    {todo.text}

    +{:else} +

    No tasks today!

    +{/each} +``` + +It is possible to iterate over iterables like `Map` or `Set`. Iterables need to be finite and static (they shouldn't change while being iterated over). Under the hood, they are transformed to an array using `Array.from` before being passed off to rendering. If you're writing performance-sensitive code, try to avoid iterables and use regular arrays as they are more performant. + +## Other block types + +Svelte also provides [`#snippet`](snippets), [`#key`](transitions-and-animations) and [`#await`](data-fetching) blocks. You can find out more about them in their respective sections. diff --git a/markdown_files/sveltejs-svelte/docs/02-template-syntax/04-snippets.md b/markdown_files/sveltejs-svelte/docs/02-template-syntax/04-snippets.md new file mode 100644 index 0000000..ffaecd7 --- /dev/null +++ b/markdown_files/sveltejs-svelte/docs/02-template-syntax/04-snippets.md @@ -0,0 +1,253 @@ +--- +title: Snippets +--- + +Better title needed? + +- `#snippet` +- `@render` +- how they can be used to reuse markup +- how they can be used to pass UI content to components + +Snippets, and _render tags_, are a way to create reusable chunks of markup inside your components. Instead of writing duplicative code like [this](/#H4sIAAAAAAAAE5VUYW-kIBD9K8Tmsm2yXXRzvQ-s3eR-R-0HqqOQKhAZb9sz_vdDkV1t000vRmHewMx7w2AflbIGG7GnPlK8gYhFv42JthG-m9Gwf6BGcLbVXZuPSGrzVho8ZirDGpDIhldgySN5GpEMez9kaNuckY1ANJZRamRuu2ZnhEZt6a84pvs43mzD4pMsUDDi8DMkQFYCGdkvsJwblFq5uCik9bmJ4JZwUkv1eoknWigX2eGNN6aGXa6bjV8ybP-X7sM36T58SVcrIIV2xVIaA41xeD5kKqWXuqpUJEefOqVuOkL9DfBchGrzWfu0vb-RpTd3o-zBR045Ga3HfuE5BmJpKauuhbPtENlUF2sqR9jqpsPSxWsMrlngyj3VJiyYjJXb1-lMa7IWC-iSk2M5Zzh-SJjShe-siq5kpZRPs55BbSGU5YPyte4vVV_VfFXxVb10dSLf17pS2lM5HnpPxw4Zpv6x-F57p0jI3OKlVnhv5V9wPQrNYQQ9D_f6aGHlC89fq1Z3qmDkJCTCweOGF4VUFSPJvD_DhreVdA0eu8ehJJ5x91dBaBkpWm3ureCFPt3uzRv56d4kdp-2euG38XZ6dsnd3ZmPG9yRBCrzRUvi-MccOdwz3qE-fOZ7AwAhlrtTUx3c76vRhSwlFBHDtoPhefgHX3dM0PkEAAA=)... + +```svelte +{#each images as image} + {#if image.href} + +
    + {image.caption} +
    {image.caption}
    +
    +     + {:else} +
    + {image.caption} +
    {image.caption}
    +
    + {/if} +{/each} +``` + +...you can write [this](/#H4sIAAAAAAAAE5VUYW-bMBD9KxbRlERKY4jWfSA02n5H6QcXDmwVbMs-lnaI_z6D7TTt1moTAnPvzvfenQ_GpBEd2CS_HxPJekjy5IfWyS7BFz0b9id0CM62ajDVjBS2MkLjqZQldoBE9KwFS-7I_YyUOPqlRGuqnKw5orY5pVpUduj3mitUln5LU3pI0_UuBp9FjTwnDr9AHETLMSeHK6xiGoWSLi9yYT034cwSRjohn17zcQPNFTs8s153sK9Uv_Yh0-5_5d7-o9zbD-UqCaRWrllSYZQxLw_HUhb0ta-y4NnJUxfUvc7QuLJSaO0a3oh2MLBZat8u-wsPnXzKQvTtVVF34xK5d69ThFmHEQ4SpzeVRediTG8rjD5vBSeN3E5JyHh6R1DQK9-iml5kjzQUN_lSgVU8DhYLx7wwjSvRkMDvTjiwF4zM1kXZ7DlF1eN3A7IG85e-zRrYEjjm0FkI4Cc7Ripm0pHOChexhcWXzreeZyRMU6Mk3ljxC9w4QH-cQZ_b3T5pjHxk1VNr1CDrnJy5QDh6XLO6FrLNSRb2l9gz0wo3S6m7HErSgLsPGMHkpDZK31jOanXeHPQz-eruLHUP0z6yTbpbrn223V70uMXNSpQSZjpL0y8hcxxpNqA6_ql3BQAxlxvfpQ_uT9GrWjQC6iRHM8D0MP0GQsIi92QEAAA=): + +```svelte +{#snippet figure(image)} +
    + {image.caption} +
    {image.caption}
    +
    +{/snippet} + +{#each images as image} + {#if image.href} + + {@render figure(image)} + + {:else} + {@render figure(image)} + {/if} +{/each} +``` + +Like function declarations, snippets can have an arbitrary number of parameters, which can have default values, and you can destructure each parameter. You cannot use rest parameters however. + +## Snippet scope + +Snippets can be declared anywhere inside your component. They can reference values declared outside themselves, for example in the ` + +{#snippet hello(name)} +

    hello {name}! {message}!

    +{/snippet} + +{@render hello('alice')} +{@render hello('bob')} +``` + +...and they are 'visible' to everything in the same lexical scope (i.e. siblings, and children of those siblings): + +```svelte +
    + {#snippet x()} + {#snippet y()}...{/snippet} + + + {@render y()} + {/snippet} + + + {@render y()} +
    + + +{@render x()} +``` + +Snippets can reference themselves and each other ([demo](/#H4sIAAAAAAAAE2WPTQqDMBCFrxLiRqH1Zysi7TlqF1YnENBJSGJLCYGeo5tesUeosfYH3c2bee_jjaWMd6BpfrAU6x5oTvdS0g01V-mFPkNnYNRaDKrxGxto5FKCIaeu1kYwFkauwsoUWtZYPh_3W5FMY4U2mb3egL9kIwY0rbhgiO-sDTgjSEqSTvIDs-jiOP7i_MHuFGAL6p9BtiSbOTl0GtzCuihqE87cqtyam6WRGz_vRcsZh5bmRg3gju4Fptq_kzQBAAA=)): + +```svelte +{#snippet blastoff()} + 🚀 +{/snippet} + +{#snippet countdown(n)} + {#if n > 0} + {n}... + {@render countdown(n - 1)} + {:else} + {@render blastoff()} + {/if} +{/snippet} + +{@render countdown(10)} +``` + +## Passing snippets to components + +Within the template, snippets are values just like any other. As such, they can be passed to components as props ([demo](/#H4sIAAAAAAAAE41SwY6bMBD9lRGplKQlYRMpF5ZF7T_0ttmDwSZYJbZrT9pGlv-9g4Fkk-xhxYV5vHlvhjc-aWQnXJK_-kSxo0jy5IcxSZrg2fSF-yM6FFQ7fbJ1jxSuttJguVd7lEejLcJPVnUCGquPMF9nsVoPjfNnohGx1sohMU4SHbzAa4_t0UNvmcOcGUNDzFP4jeccdikYK2v6sIWQ3lErpui5cDdPF_LmkVy3wlp5Vd5e2U_rHYSe_kYjFtl1KeVnTkljBEIrGBd2sYy8AtsyLlBk9DYhJHtTR_UbBDWybkR8NkqHWyOr_y74ZMNLz9f9AoG6ePkOJLMHLBp-xISvcPf11r0YUuMM2Ysfkgngh5XphUYKkJWU_FFz2UjBkxztSYT0cihR4LOn0tGaPrql439N-7Uh0Dl8MVYbt1jeJ1Fg7xDb_Uw2Y18YQqZ_S2U5FH1pS__dCkWMa3C0uR0pfQRTg89kE4bLLLDS_Dxy_Eywuo1TAnPAw4fqY1rvtH3W9w35ZZMgvU3jq8LhedwkguCHRhT_cMU6eVA5dKLB5wGutCWjlTOslupAxxrxceKoD2hzhe2qbmXHF1v1bbOcNCtW_zpYfVI8h5kQ4qY3mueHTlesW2C7TOEO4hcdwzgf3Nc7cZxUKKC4yuNhvIX_MlV_Xk0EAAA=)): + +```svelte + + +{#snippet header()} + fruit + qty + price + total +{/snippet} + +{#snippet row(d)} + {d.name} + {d.qty} + {d.price} + {d.qty * d.price} +{/snippet} + + +``` + +Think about it like passing content instead of data to a component. The concept is similar to slots in web components. + +As an authoring convenience, snippets declared directly _inside_ a component implicitly become props _on_ the component ([demo](/#H4sIAAAAAAAAE41Sy27bMBD8lYVcwHYrW4kBXxRFaP-htzgHSqQsojLJkuu2BqF_74qUrfhxCHQRh7MzO9z1SSM74ZL8zSeKHUSSJz-MSdIET2Y4uD-iQ0Fnp4-2HpDC1VYaLHdqh_JgtEX4yapOQGP1AebrLJzWsXD-QjQi1lo5JMZRooNXeBuwHXoYLHOYM2OoiXkKv_GUwzYFY2VNFxvo0xtqxRR9F-7z04X8fE-uW2GtnJQ3E_tpvYV-oL9Ti0U2hVJFjMMZslcfW-5DWj9zShojEFrBuLCLZR_9CmzLQCwy-psw8rxBgvkNhhpZd8F8NppE7Stbq_8u-GTKS8_XQ9Keqnl5BZP1AzTYP2bDV7i7_9hLEeda0iocNJeNFDzJ0R5Fn142JzA-uzsdBfLhldPxPdMhIPS0H1-M1cYtlnejwdBDfBXZjHXTFOg4BhuOtvTfrVDEmAZG2ew5ezYV-Ew2fVzVAivNTyPHzwSr29AlMAe8f6g-zuWDts-GusAmdBSkv3P7qnB4GpMEEHwsRPEPV6yTe5VDJxp8iXClLRmtnGG1VHva3oCPHQd9QJsrbFd1Kzu-2Khvz8uzZsXqX3urj4rnMBNCXNUG83zf6Yp1C2yXKdxA_KJjGOfRfb0Vh7MKDShEuV-M9_4_nq6svF4EAAA=)): + +```svelte + +
    + {#snippet header()} + + + + + {/snippet} + + {#snippet row(d)} + + + + + {/snippet} +
    fruitqtypricetotal{d.name}{d.qty}{d.price}{d.qty * d.price}
    +``` + +Any content inside the component tags that is _not_ a snippet declaration implicitly becomes part of the `children` snippet ([demo](/#H4sIAAAAAAAAE41S247aMBD9lVFYCegGsiDxks1G7T_0bdkHJ3aI1cR27aEtsvzvtZ0LZeGhiiJ5js-cmTMemzS8YybJ320iSM-SPPmmVJImeFEhML9Yh8zHRp51HZDC1JorLI_iiLxXUiN8J1XHoNGyh-U2i9F2SFy-epon1lIY9IwzRwNv8B6wI1oIJXNYEqV8E8sUfuIlh0MKSvPaX-zBpZ-oFRH-m7m7l5m8uyfXLdOaX5X3V_bL9gAu0D98i0V2NSWKwQ4lSN7s0LKLbgtsyxgXmT9NiBe-iaP-DYISSTcj4bcLI7hSDEHL3yu6dkPfBdLS0m1o3nk-LW9gX-gBGss9ZsMXuLu32VjZBdfRaelft5eUN5zRJEd9Zi6dlyEy_ncdOm_IxsGlULe8o5qJNFgE5x_9SWmpzGp9N2-MXQxz4c2cOQ-lZWQyF0Jd2q_-mjI9U1fr4FBPE8iuKTbjjRt2sMBK0svIsQtG6jb2CsQAdQ_1x9f5R9tmIS-yPToK-tNkQRQGL6ObCIIdEpH9wQ3p-Enk0LEGXwe4ktoX2hhFai5Ofi0jPnYc9QF1LrDdRK-rvXjerSfNitQ_TlqeBc1hwRi7yY3F81MnK9KtsF2n8Amis44ilA7VtwfWTyr-kaKV-_X4cH8BTOhfRzcEAAA=)): + +```svelte + + +``` + +> Note that you cannot have a prop called `children` if you also have content inside the component — for this reason, you should avoid having props with that name + +You can declare snippet props as being optional. You can either use optional chaining to not render anything if the snippet isn't set... + +```svelte + + +{@render children?.()} +``` + +...or use an `#if` block to render fallback content: + +```svelte + + +{#if children} + {@render children()} +{:else} + fallback content +{/if} +``` + +## Typing snippets + +Snippets implement the `Snippet` interface imported from `'svelte'`: + +```svelte + +``` + +With this change, red squigglies will appear if you try and use the component without providing a `data` prop and a `row` snippet. Notice that the type argument provided to `Snippet` is a tuple, since snippets can have multiple parameters. + +We can tighten things up further by declaring a generic, so that `data` and `row` refer to the same type: + +```svelte + +``` + +## Snippets and slots + +In Svelte 4, content can be passed to components using [slots](https://svelte.dev/docs/special-elements#slot). Snippets are more powerful and flexible, and as such slots are deprecated in Svelte 5. diff --git a/markdown_files/sveltejs-svelte/docs/02-template-syntax/05-styles-and-classes.md b/markdown_files/sveltejs-svelte/docs/02-template-syntax/05-styles-and-classes.md new file mode 100644 index 0000000..4a1497f --- /dev/null +++ b/markdown_files/sveltejs-svelte/docs/02-template-syntax/05-styles-and-classes.md @@ -0,0 +1,235 @@ +--- +title: Styles & Classes +--- + +- style scoping +- `:global` +- `style:` +- `class:` +- `--css` props + +Styling is a fundamental part of UI components. Svelte helps you style your components with ease, providing useful features out of the box. + +## Scoped by default + +By default CSS inside a ` +``` + +## :global(...) + +To apply styles to a single selector globally, use the `:global(...)` modifier: + +```svelte + +``` + +If you want to make @keyframes that are accessible globally, you need to prepend your keyframe names with `-global-`. + +The `-global-` part will be removed when compiled, and the keyframe will then be referenced using just `my-animation-name` elsewhere in your code. + +```svelte + +``` + +## :global + +To apply styles to a group of selectors globally, create a `:global {...}` block: + +```svelte + +``` + +> The second example above could also be written as an equivalent `.a :global .b .c .d` selector, where everything after the `:global` is unscoped, though the nested form is preferred. + +## Nested style tags + +There should only be 1 top-level ` +
    +``` + +## class:_name_ + +```svelte + +class:name={value} +``` + +```svelte + +class:name +``` + +A `class:` directive provides a shorter way of toggling a class on an element. + +```svelte + +
    ...
    +
    ...
    + + +
    ...
    + + +
    ...
    +``` + +## style:_property_ + +```svelte + +style:property={value} +``` + +```svelte + +style:property="value" +``` + +```svelte + +style:property +``` + +The `style:` directive provides a shorthand for setting multiple styles on an element. + +```svelte + +
    ...
    +
    ...
    + + +
    ...
    + + +
    ...
    + + +
    ...
    + + +
    ...
    +``` + +When `style:` directives are combined with `style` attributes, the directives will take precedence: + +```svelte +
    This will be red
    +``` + +## --style-props + +```svelte + +--style-props="anycssvalue" +``` + +You can also pass styles as props to components for the purposes of theming, using CSS custom properties. + +Svelte's implementation is essentially syntactic sugar for adding a wrapper element. This example: + +```svelte + +``` + +Desugars to this: + +```svelte +
    + +
    +``` + +For SVG namespace, the example above desugars into using `` instead: + +```svelte + + + +``` + +> Since this is an extra `
    ` (or ``), beware that your CSS structure might accidentally target this. Be mindful of this added wrapper element when using this feature. + +Svelte's CSS Variables support allows for easily themeable components: + +```svelte + +``` + +So you can set a high-level theme color: + +```css +/* global.css */ +html { + --theme-color: black; +} +``` + +Or override it at the consumer level: + +```svelte + +``` diff --git a/markdown_files/sveltejs-svelte/docs/02-template-syntax/06-transitions-and-animations.md b/markdown_files/sveltejs-svelte/docs/02-template-syntax/06-transitions-and-animations.md new file mode 100644 index 0000000..8163d96 --- /dev/null +++ b/markdown_files/sveltejs-svelte/docs/02-template-syntax/06-transitions-and-animations.md @@ -0,0 +1,432 @@ +--- +title: Transitions & Animations +--- + +- how to use (template syntax) +- when to use +- global vs local +- easing & motion +- mention imports +- key block + +Svelte provides different techniques and syntax for incorporating motion into your Svelte projects. + +## transition:_fn_ + +```svelte + +transition:fn +``` + +```svelte + +transition:fn={params} +``` + +```svelte + +transition:fn|global +``` + +```svelte + +transition:fn|global={params} +``` + +```svelte + +transition:fn|local +``` + +```svelte + +transition:fn|local={params} +``` + +```js +/// copy: false +// @noErrors +transition = (node: HTMLElement, params: any, options: { direction: 'in' | 'out' | 'both' }) => { + delay?: number, + duration?: number, + easing?: (t: number) => number, + css?: (t: number, u: number) => string, + tick?: (t: number, u: number) => void +} +``` + +A transition is triggered by an element entering or leaving the DOM as a result of a state change. + +When a block is transitioning out, all elements inside the block, including those that do not have their own transitions, are kept in the DOM until every transition in the block has been completed. + +The `transition:` directive indicates a _bidirectional_ transition, which means it can be smoothly reversed while the transition is in progress. + +```svelte +{#if visible} +
    fades in and out
    +{/if} +``` + +Transitions are local by default. Local transitions only play when the block they belong to is created or destroyed, _not_ when parent blocks are created or destroyed. + +```svelte +{#if x} + {#if y} +

    fades in and out only when y changes

    + +

    fades in and out when x or y change

    + {/if} +{/if} +``` + +> By default intro transitions will not play on first render. You can modify this behaviour by setting `intro: true` when you [create a component](/docs/runtime/imperative-component-api) and marking the transition as `global`. + +## Transition parameters + +Transitions can have parameters. + +(The double `{{curlies}}` aren't a special syntax; this is an object literal inside an expression tag.) + +```svelte +{#if visible} +
    fades in and out over two seconds
    +{/if} +``` + +## Custom transition functions + +Transitions can use custom functions. If the returned object has a `css` function, Svelte will create a CSS animation that plays on the element. + +The `t` argument passed to `css` is a value between `0` and `1` after the `easing` function has been applied. _In_ transitions run from `0` to `1`, _out_ transitions run from `1` to `0` — in other words, `1` is the element's natural state, as though no transition had been applied. The `u` argument is equal to `1 - t`. + +The function is called repeatedly _before_ the transition begins, with different `t` and `u` arguments. + +```svelte + + +{#if visible} +
    whooshes in
    +{/if} +``` + +A custom transition function can also return a `tick` function, which is called _during_ the transition with the same `t` and `u` arguments. + +> If it's possible to use `css` instead of `tick`, do so — CSS animations can run off the main thread, preventing jank on slower devices. + +```svelte + + + +{#if visible} +

    The quick brown fox jumps over the lazy dog

    +{/if} +``` + +If a transition returns a function instead of a transition object, the function will be called in the next microtask. This allows multiple transitions to coordinate, making [crossfade effects](/tutorial/deferred-transitions) possible. + +Transition functions also receive a third argument, `options`, which contains information about the transition. + +Available values in the `options` object are: + +- `direction` - one of `in`, `out`, or `both` depending on the type of transition + +## Transition events + +An element with transitions will dispatch the following events in addition to any standard DOM events: + +- `introstart` +- `introend` +- `outrostart` +- `outroend` + +```svelte +{#if visible} +

    (status = 'intro started')} + on:outrostart={() => (status = 'outro started')} + on:introend={() => (status = 'intro ended')} + on:outroend={() => (status = 'outro ended')} + > + Flies in and out +

    +{/if} +``` + +## in:_fn_/out:_fn_ + +```svelte + +in:fn +``` + +```svelte + +in:fn={params} +``` + +```svelte + +in:fn|global +``` + +```svelte + +in:fn|global={params} +``` + +```svelte + +in:fn|local +``` + +```svelte + +in:fn|local={params} +``` + +```svelte + +out:fn +``` + +```svelte + +out:fn={params} +``` + +```svelte + +out:fn|global +``` + +```svelte + +out:fn|global={params} +``` + +```svelte + +out:fn|local +``` + +```svelte + +out:fn|local={params} +``` + +Similar to `transition:`, but only applies to elements entering (`in:`) or leaving (`out:`) the DOM. + +Unlike with `transition:`, transitions applied with `in:` and `out:` are not bidirectional — an in transition will continue to 'play' alongside the out transition, rather than reversing, if the block is outroed while the transition is in progress. If an out transition is aborted, transitions will restart from scratch. + +```svelte +{#if visible} +
    flies in, fades out
    +{/if} +``` + +## animate:_fn_ + +```svelte + +animate:name +``` + +```svelte + +animate:name={params} +``` + +```js +/// copy: false +// @noErrors +animation = (node: HTMLElement, { from: DOMRect, to: DOMRect } , params: any) => { + delay?: number, + duration?: number, + easing?: (t: number) => number, + css?: (t: number, u: number) => string, + tick?: (t: number, u: number) => void +} +``` + +```ts +/// copy: false +// @noErrors +DOMRect { + bottom: number, + height: number, + ​​left: number, + right: number, + ​top: number, + width: number, + x: number, + y: number +} +``` + +An animation is triggered when the contents of a [keyed each block](control-flow#each) are re-ordered. Animations do not run when an element is added or removed, only when the index of an existing data item within the each block changes. Animate directives must be on an element that is an _immediate_ child of a keyed each block. + +Animations can be used with Svelte's [built-in animation functions](/docs/svelte/reference/svelte-animate) or [custom animation functions](#custom-animation-functions). + +```svelte + +{#each list as item, index (item)} +
  • {item}
    • +{/each} +``` + +## Animation Parameters + +As with actions and transitions, animations can have parameters. + +(The double `{{curlies}}` aren't a special syntax; this is an object literal inside an expression tag.) + +```svelte +{#each list as item, index (item)} +
  • {item}
    • +{/each} +``` + +## Custom animation functions + +Animations can use custom functions that provide the `node`, an `animation` object and any `parameters` as arguments. The `animation` parameter is an object containing `from` and `to` properties each containing a [DOMRect](https://developer.mozilla.org/en-US/docs/Web/API/DOMRect#Properties) describing the geometry of the element in its `start` and `end` positions. The `from` property is the DOMRect of the element in its starting position, and the `to` property is the DOMRect of the element in its final position after the list has been reordered and the DOM updated. + +If the returned object has a `css` method, Svelte will create a CSS animation that plays on the element. + +The `t` argument passed to `css` is a value that goes from `0` and `1` after the `easing` function has been applied. The `u` argument is equal to `1 - t`. + +The function is called repeatedly _before_ the animation begins, with different `t` and `u` arguments. + + + +```svelte + + +{#each list as item, index (item)} +
    {item}
    +{/each} +``` + +A custom animation function can also return a `tick` function, which is called _during_ the animation with the same `t` and `u` arguments. + +> If it's possible to use `css` instead of `tick`, do so — CSS animations can run off the main thread, preventing jank on slower devices. + +```svelte + + +{#each list as item, index (item)} +
    {item}
    +{/each} +``` + +## {#key ...} + +```svelte + +{#key expression}...{/key} +``` + +Key blocks destroy and recreate their contents when the value of an expression changes. + +This is useful if you want an element to play its transition whenever a value changes. + +```svelte +{#key value} +
    {value}
    +{/key} +``` + +When used around components, this will cause them to be reinstantiated and reinitialised. + +```svelte +{#key value} + +{/key} +``` diff --git a/markdown_files/sveltejs-svelte/docs/02-template-syntax/07-actions.md b/markdown_files/sveltejs-svelte/docs/02-template-syntax/07-actions.md new file mode 100644 index 0000000..5752b03 --- /dev/null +++ b/markdown_files/sveltejs-svelte/docs/02-template-syntax/07-actions.md @@ -0,0 +1,103 @@ +--- +title: Actions +--- + +- template syntax +- how to write +- typings +- adjust so that `$effect` is used instead of update/destroy? + +```svelte + +use:action +``` + +```svelte + +use:action={parameters} +``` + +```ts +/// copy: false +// @noErrors +action = (node: HTMLElement, parameters: any) => { + update?: (parameters: any) => void, + destroy?: () => void +} +``` + +Actions are functions that are called when an element is created. They can return an object with a `destroy` method that is called after the element is unmounted: + +```svelte + + + +
    +``` + +An action can have a parameter. If the returned value has an `update` method, it will be called immediately after Svelte has applied updates to the markup whenever that parameter changes. + +> Don't worry that we're redeclaring the `foo` function for every component instance — Svelte will hoist any functions that don't depend on local state out of the component definition. + +```svelte + + + +
    +``` + +## Attributes + +Sometimes actions emit custom events and apply custom attributes to the element they are applied to. To support this, actions typed with `Action` or `ActionReturn` type can have a last parameter, `Attributes`: + +```svelte + + + +
    +``` diff --git a/markdown_files/sveltejs-svelte/docs/02-template-syntax/08-bindings.md b/markdown_files/sveltejs-svelte/docs/02-template-syntax/08-bindings.md new file mode 100644 index 0000000..73b49cd --- /dev/null +++ b/markdown_files/sveltejs-svelte/docs/02-template-syntax/08-bindings.md @@ -0,0 +1,305 @@ +--- +title: Bindings +--- + +- how for dom elements +- list of all bindings +- how for components + +Most of the time a clear separation between data flowing down and events going up is worthwhile and results in more robust apps. But in some cases - especially when interacting with form elements - it's more ergonomic to declare a two way binding. Svelte provides many element bindings out of the box, and also allows component bindings. + +## bind:_property_ for elements + +```svelte + +bind:property={variable} +``` + +Data ordinarily flows down, from parent to child. The `bind:` directive allows data to flow the other way, from child to parent. Most bindings are specific to particular elements. + +The simplest bindings reflect the value of a property, such as `input.value`. + +```svelte + +