* fix: more robust handling of var declarations
- fixes#12807: state declared with var is now retrieved using a new `safe_get` function, which works like `get` but checks for undefined
- fixes#12900: ensure we're not creating another new scope for block statements of function declarations, which resulted in var declarations getting "swallowed" (because they were hoisted to the function declaration scope and never seen by our logic)
* simplify
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
The backing store variable of a $store read could be a variable that itself needs a transformer, which is why we need to make accessing the reads lazy
fixes#12859
* breaking: deprecate `context="module"` in favor of `module`
Also reserve a few attributes, which we may or may not use in the future
closes#12637
* fix tests
* one more
* add svelte package to the root so eslint and prettier can use it
* tweak messages
* warn on unknown attributes
* regenerate
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* feat: adds $state.link rune
* add tests
* types
* docs
* debugger
* lint
* Update .changeset/friendly-rice-confess.md
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* Update packages/svelte/src/compiler/phases/2-analyze/index.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* feedback
* feedback
* feedback
* feedback
* rename link_state to linked_state for grammatical consistency
* oops, victim of find-replace
* no need to store linked_value if setting
* simplify tests
* test behaviour of objects
* update docs
* copy
* more direct example that shows unlinking and relinking
* add callback argument support
* fix
* tidy up
* document callback
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
We need to allow mixing those within custom element components because in a future version of Svelte where we remove the Svelte-version of slots, we'll preserve slots as-is, and people should use those within their components. At the same time they should be able to make use of snippets for reusable blocks of code.
Also document that you should continue using slots within custom elements.
closes#12892
* feat: treat tag with `[` as a component, even if lowercase
* chore: simpler regex
Co-authored-by: Conduitry <git@chor.date>
* feat: error on invalid component name
* fix: fully revert dot notation test
* tweak error message
---------
Co-authored-by: Conduitry <git@chor.date>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* step one
* WIP
* more
* fix
* collapse sequential sibling calls
* working
* working but messy
* tidy up
* unused
* tweak
* tweak
* tidy
* tweak
* tweak
* revert
* changeset
* Update packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/fragment.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* revert this bit
* align
* comments
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* chore: use closures for state proxies
* use variables
* early return
* tidy up
* move ownership stuff into separate object
* put original value directly on STATE_SYMBOL
* rename
* tidy up
* tidy
* tweak
* fix
* remove is_frozen check
* remove `$state.is`
* avoid mutations
* tweak
* changesets
* changeset
* changeset
* regenerate
* add comment
* add note
* add test
* fix: improve createRawSnippet types
Add cleanup type to return value of setup function
* changeset
---------
Co-authored-by: Rich Harris <hello@rich-harris.dev>
* fix: avoid throwing `store_invalid_subscription_module` for runes
Co-authored-by: Paolo Ricciuti <ricciutipaolo@gmail.com>
* move test to the validator suite, which is faster
---------
Co-authored-by: Paolo Ricciuti <ricciutipaolo@gmail.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* analyse exports before walking
* more
* another
* this is unused
* move stuff/tidy up
* this appears to be unnecessary
* this is all unnecessary
* simplify
* simplify
* simplify
* simplify
* move more stuff over
* changeset
* unused
* separate reassignment from mutation
* regenerate
* lint
* feat: add compiler error when encountering a $-prefixed store value outside a .svelte file
* add fromState/toState APIs
* another test, update types
* rename fromState to toStore, and toState to fromStore
* docs
* add docs
* separate client/server entry points for svelte/store
* fix: provide more hydration mismatch coverage
* tweak
* add test for safari borking stuff
* fix
* fix windows test
* failing test
* oops
* revert playground changes
* simplify
* template content hydration logic should really be separate from reset logic
* actually the test is incorrect, and now i cant seem to recreate what i saw before... hmm
* update comment to no longer mention templates
* failing test
* delete test for now
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* speed up exclude_from_object
* changeset
* convert prop names to string at compile time
* faster still
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* chore: add warning for derived self referencin
* update build
* address feedback
* address feedback
* build
* messages shouldn't end with a period
* simplify test
* regenerate
* newlines are free
* no need to export this, we can move it closer to where it's used
* fix double negative
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* simplify
* fix/simplify
* fix/simplify
* start getting a grip of this mess
* tidy up
* more
* more
* more
* tidy up
* make things a bit less weird
* tweak
* more
* more
* add once once
* consolidate event handling code
* some progress. man, this stuff is entangled
* more
* tidy up
* simplify
* simplify
* more
* fix
* fix test names
* fix a bug
* tidy up
* changeset
* simplify
* regenerate
* tidy up
* tidy up
* tidy up
* simplify
* the module declaration case is already accounted for, above
* simplify/document
* typo
* "hoistable" is a misnomer
* hoist non_hoistable, rename
* more typos
* tweak
* regenerate
* fix: add css hash to custom element rendered with `svelte:element`
* simplify
* skip arg where possible
* drive-by improvements — remove some unnecessary arguments where possible
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* feat: function called as tagged template literal is reactively called
Co-authored-by: Oscar Dominguez <dominguez.celada@gmail.com>
* chore: re-organize import of visitors
* simplify
---------
Co-authored-by: Oscar Dominguez <dominguez.celada@gmail.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* start refactoring client transform visitor code
* more
* more
* more
* more
* more
* more
* more
* more
* more
* more
* more
* more
* more
* more
* more
* tweak
* painful
* more
* simplify
* more
* more
* more
* more
* more
* tidy up
* changeset
* fix: allow nested `<dt>`/`<dd>` elements if they are within a `<dl>` element
This introduces a resets array, which means descendants that are forbidden are allowed again, if an element within the resets array is encountered between the tag and the forbidden descendant
fixes#12676
* better name
* chore: perf tweaks for actions/styles/classes
- check if we really need to add/remove the class (calling `includes` first is cheaper than always setting/removing it)
- check if we really need to update a style (calling `getPropertyValue/setProperty` is expensive)
- check if we should call the action's update function (this is not only a perf tweak but also a correctness fix)
closes#12652
* changeset
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* start moving visitors into separate modules
* remove unused code
* more
* more
* tidy up
* more
* more
* more
* more
* more
* more
* more
* more
* more
* more
* more
* alphabetize
* more
* fix
* more
* more
* consolidate
* more
* more
* more
* more
* more
* more
* more
* tweak
* more
* more
* more
* more
* more
* more
* more
* more
* more
* more
* jfc what are we doing here
* more
* bizarre
* more
* more
* more
* more
* more
* more
* tidy
* one down
* dont merge
* hmm
* DRY
* more
* more
* tidy up
* tidy up
* add changeset, as this should have its own release
* tidy up
* oh i should probably hit save
* feat: make `<svelte:component>` unnecessary in runes mode
In Svelte 4, writing `<Component />` meant that the component instance is static. If you made the variable `Component` a reactive state variable and updated the component value, the component would not be reinstantiated with the new value - you had to use `<svelte:component>` for that. One reason was that having a dynamic component was more overhead, which is no longer the case in Svelte 5. We can therefore reduce the potential API surface area (by maybe deprecating `<svelte:component>` in the future) by allowing Svelte to recognize when a component variable is potentially dynamic. It turned out that this was already mostly the case. This PR fixes one case where it wasn't, and fixes another where this was wrongfully applied in legacy mode.
* we already have this function
* add interactive demos
* changeset
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
language tools has to type its own shape for backwards compatibility, and it currently doesn't include the `$on` and `$set` methods, which means without widening the type as done here you would get a "this shape is not accepted" type error when passing it to `ComponentProps`
closes#12627
Closes#12643
Very weird behaviour from the draggable setter...if you set element.draggable="false" it will actually set draggable to true (the boolean).
* better code generation for slot props in SSR
* simplify
* remove getters mechanism from server compiler
* changeset
* no need to use getters in SSR mode
* fix comment
* add state.getters as alternative to binding.expression
* on second thoughts
* fix
* first of many
* couple more
* regenerate types
* more
* another
* more
* another
* another
* another
* remove binding.expression from client-side code
* tweak
* last one
* comment
* regenerate types
* add a changeset
* small tidy up
* simplify
* simplify
* simplify and fix
* simplify
* fix: ensure dynamic event handlers are wrapped in a derived
* fix test
* feedback
* more feedback
* address feedback
* we have .svelte.js files
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: bail-out of hydrating head if no anchor is found
* add failing test
* fix
* fix comment
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* add invalid_default_snippet error message
* fix: improve validation error that occurs when using `{@render ...}` to render default slotted content
* cheeky hack to keep treeshakeability until we can nuke this validation altogether
Previously, if transitions/animations were playing in quick succession, overlapping each other, it could have disastrous outcomes, leading to elements jumping all over the place.
This PR gets that into much better state (not completely fixed, but close) by applying a few fixes:
- destructure style object from `getComputedStyles`, because it's a live object with getters and we're interested in the fixed values at the beginning
- `unfix` for animations didn't reset the transition styles
- don't apply `fix` when we detect already-running animations on the element. That means it's already away from its original position, and doesn't need fixing. Worse, applying an absolute position can lead to the element jumping to the top left if the running animation also applies a transition style - those take precedence over the one we would apply
fixes#10252
* fix: properly assign trailing comments
Trailing comments were added even if they started before the node end, which violates the definition of trailing comments.
This fixes that, with the consequence that some comments no longer show up in the AST at all. Previously they were stuffed _somewhere_, but arguably at the wrong positions. For example the last comment in a function body got assigned as a trailing comma for the body, which is wrong, because the body ends _after_ the comma.
The special case is comments at the end of an expression tag - they are added even if there are multiple, and they are added regardless of whether they are separated by newlines or not. This ensures the expression tag end is calculated correctly.
Fixes#12466
* support multiple trailing comments after last statement in a body
* simplify, handle object and array expressions
* parse `foo={bar}` attribute as `value: { type: 'ExpressionTag', .. }` (i.e. don't wrap in an array)
* warn on quoted single-expression-attributes
* breaking: warn on quotes single-expression attributes in runes mode
In a future version, that will mean things are getting stringified, which is a departure from how things work today, therefore a warning first.
Related to #7925
* Update .changeset/plenty-items-build.md
* Apply suggestions from code review
* missed a spot
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
The head hydration anchor didn't update after hydrating the contents of one `<svelte:head>` element, which meant subsequent `<svelte:head>` elements would always start at the beginning of the head. This PR fixes that. The test was updated such that the shape of each `<svelte:head>` content is sufficiently different to throw an error if this wasn't fixed.
fixes#12458
* fix: ensure `$state.snapshot` never errors
Snapshotting can error on un-cloneable objects. It's not practical to error in this case; often there's no way out of this for users, so it makes sense to return the original value in that case, and warn in dev mode about it.
closes#12438
* lint
* single warning per snapshot call, list affected properties
* lint
* lint
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: ensure previous transitions are properly aborted
- nullify options when the transition is aborted. This ensures a change in options is reflected the next time, else it would stick around indefinetly
- abort previous intro (if exists) when new intro plays (same for outro)
fixes#11372
* add a test
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
When Vite calls `hot.accept`, it passes the wrapped component, which means we're passing the HMR wrapper along as the new component. Avoid that by maintaining a reference to the original component.
* feat: add ability to ignore warnings through compiler option
Some people want to disable certain warnings for their whole application without having to add svelte-ignore comments everywhere. This new option makes that possible.
closes#9188
part of https://github.com/sveltejs/language-tools/issues/650
* make it a function
* singular
* warningFilter
* make internal filter non-nullable
* Update .changeset/little-seals-reflect.md
* filter_warning -> warning_filter, for symmetry with public option
* fix
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
We've marked several methods used for walking the DOM with a `__NO_SIDE_EFFECTS__` comment. That was good historically, because we didn't need those kept around if its results were unused, but since the hydration changes in #12335 this actually introduces a bug: Because that PR now relies on the hydration nodes being correct due to walking the DOM, tree-shaking unused variables/calls results in the walk being incorrect, leading to bugs
Fixes#12422
* fix: prevent whitespaces merging across component boundaries
The logic that was there didn't take components into account. The underlying problem is that the parent isn't properly set to `Fragment` in all cases because of nested `visit` calls we do in some places.
Fixes#12447
* update test
This enhances our "variable was mutated" detection to also recognize that `foo` in `[foo[1]] = [..]` was mutated. This allows us to be more granular about detecting mutations to each expressions in legacy mode, which fixes#12169
---------
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
* move cloning logic into new file, use structuredClone, add tests
* changeset
* breaking
* tweak
* use same cloning approach between server and client
* get types mostly working
* fix type error that popped up
* cheeky hack
* we no longer need deep_snapshot
* shallow copy state when freezing
* throw if argument is a state proxy
* docs
* regenerate
The previous validation for checking if slots with let directives were rendered with `{@render children(...)}` had false positives
- threw an error even if the other side didn't make use of the arguments, i.e. wasn't actually using a let directive
- didn't check that the rendered snippet actually was the children property
This fixes the validation by only applying it to children render tags, and by adding the slot to `$$slots.default` instead of `$$props.children` in more cases (when it's using `<svelte:fragment>` or `let:` directives, which both mean you're using old slot syntax)
Fixes#12414
* fix: cache call expressions in render tag arguments
Ensure that they're called at most once per change, not once per access within the snippet
fixes#12187
* leverage state
* types
* fix
* fix: properly delay intro transitions
WAAPI applies the styles of a delayed animation only when that animation starts. In the case of fade-in transitions that means the element is visible, then goes invisible and fades in. Fix that by never applying a delay on intro transitions, instead add keyframes of the initial state for the duration of the delay.
Fixes#10876
* fix bug, make test pass
* make test more selfcontained, test outro delay aswell and add functionality for that in animation-helpers
* lint
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>