svelte - npm Package Compare versions

Comparing version 5.0.0-next.141 to 5.0.0-next.142

package.json

@@ -5,3 +5,3 @@ {
   "license": "MIT",
-  "version": "5.0.0-next.141",
+  "version": "5.0.0-next.142",
   "type": "module",
@@ -8,0 +8,0 @@ "types": "./types/index.d.ts",

src/compiler/phases/1-parse/remove_typescript_nodes.js

 import { walk } from 'zimmerframe';
 import * as b from '../../utils/builders.js';
 
+/**
+ * @param {import('estree').FunctionExpression | import('estree').FunctionDeclaration} node
+ * @param {import('zimmerframe').Context<any, any>} context
+ */
+function remove_this_param(node, context) {
+	if (node.params[0]?.type === 'Identifier' && node.params[0].name === 'this') {
+		node.params.shift();
+	}
+	return context.next();
+}
+
 /** @type {import('zimmerframe').Visitors<any, null>} */
@@ -74,3 +85,5 @@ const visitors = {
 		return node;
-	}
+	},
+	FunctionExpression: remove_this_param,
+	FunctionDeclaration: remove_this_param
 };
@@ -77,0 +90,0 @@

src/compiler/phases/2-analyze/index.js

@@ -21,3 +21,8 @@ import is_reference from 'is-reference';
 import { create_attribute, is_element_node } from '../nodes.js';
-import { DelegatedEvents, namespace_mathml, namespace_svg } from '../../../constants.js';
+import {
+	DelegatedEvents,
+	is_capture_event,
+	namespace_mathml,
+	namespace_svg
+} from '../../../constants.js';
 import { should_proxy_or_freeze } from '../3-transform/client/utils.js';
@@ -289,3 +294,5 @@ import { analyze_css } from './css/css-analyze.js';
 				// const state = $state(0) is valid
-				get_rune(declaration.initial, instance.scope) === null &&
+				(get_rune(declaration.initial, instance.scope) === null ||
+					// rune-line names received as props are valid too (but we have to protect against $props as store)
+					(store_name !== 'props' && get_rune(declaration.initial, instance.scope) === '$props')) &&
 				// allow `import { derived } from 'svelte/store'` in the same file as `const x = $derived(..)` because one is not a subscription to the other
@@ -1511,3 +1518,3 @@ !(
 function get_attribute_event_name(event_name) {
-	if (is_capture_event(event_name)) {
+	if (is_capture_event(event_name, 'include-on')) {
 		event_name = event_name.slice(0, -7);
@@ -1520,12 +1527,2 @@ }
 /**
- * @param {string} name
- * @returns boolean
- */
-function is_capture_event(name) {
-	return (
-		name.endsWith('capture') && name !== 'ongotpointercapture' && name !== 'onlostpointercapture'
-	);
-}
-
-/**
  * @param {Map<import('estree').LabeledStatement, import('../types.js').ReactiveStatement>} unsorted_reactive_declarations
@@ -1532,0 +1529,0 @@ */

src/compiler/phases/3-transform/css/index.js

@@ -241,2 +241,9 @@ import MagicString from 'magic-string';
 
+				// for any :global() at the middle of compound selector
+				for (const selector of relative_selector.selectors) {
+					if (selector.type === 'PseudoClassSelector' && selector.name === 'global') {
+						remove_global_pseudo_class(selector);
+					}
+				}
+
 				if (relative_selector.selectors.some((s) => s.type === 'NestingSelector')) {
@@ -254,9 +261,2 @@ continue;
 
-				// for any :global() at the middle of compound selector
-				for (const selector of relative_selector.selectors) {
-					if (selector.type === 'PseudoClassSelector' && selector.name === 'global') {
-						remove_global_pseudo_class(selector);
-					}
-				}
-
 				let i = relative_selector.selectors.length;
@@ -263,0 +263,0 @@ while (i--) {

src/compiler/phases/scope.js

@@ -479,3 +479,3 @@ import is_reference from 'is-reference';
 		ClassDeclaration(node, { state, next }) {
-			if (node.id) state.scope.declare(node.id, 'normal', 'const', node);
+			if (node.id) state.scope.declare(node.id, 'normal', 'let', node);
 			next();
@@ -482,0 +482,0 @@ },

src/constants.js

@@ -282,1 +282,14 @@ export const EACH_ITEM_REACTIVE = 1;
 }
+
+/**
+ * @param {string} name
+ * @param {"include-on" | "exclude-on"} [mode] - wether if name starts with `on` or `on` is excluded at this point
+ */
+export function is_capture_event(name, mode = 'exclude-on') {
+	if (!name.endsWith('capture')) {
+		return false;
+	}
+	return mode == 'exclude-on'
+		? name !== 'gotpointercapture' && name !== 'lostpointercapture'
+		: name !== 'ongotpointercapture' && name !== 'onlostpointercapture';
+}

src/internal/client/dev/elements.js

 import { HYDRATION_END, HYDRATION_START } from '../../../constants.js';
 import { hydrating } from '../dom/hydration.js';
-import { is_array } from '../utils.js';
 
@@ -15,12 +14,5 @@ /**
 
-		const nodes = hydrating
-			? is_array(dom)
-				? dom
-				: [dom]
-			: dom.nodeType === 11
-				? Array.from(dom.childNodes)
-				: [dom];
+		var node = hydrating ? dom : dom.nodeType === 11 ? dom.firstChild : dom;
+		assign_locations(node, filename, locations);
 
-		assign_locations(nodes, filename, locations);
-
 		return dom;
@@ -42,7 +34,3 @@ };
 	if (location[2]) {
-		assign_locations(
-			/** @type {import('#client').TemplateNode[]} */ (Array.from(element.childNodes)),
-			filename,
-			location[2]
-		);
+		assign_locations(element.firstChild, filename, location[2]);
 	}
@@ -52,23 +40,23 @@ }
 /**
- * @param {import('#client').TemplateNode[]} nodes
+ * @param {Node | null} node
  * @param {string} filename
  * @param {import('../../../compiler/phases/3-transform/client/types.js').SourceLocation[]} locations
  */
-function assign_locations(nodes, filename, locations) {
-	var j = 0;
+function assign_locations(node, filename, locations) {
+	var i = 0;
 	var depth = 0;
 
-	for (var i = 0; i < nodes.length; i += 1) {
-		var node = nodes[i];
-
+	while (node && i < locations.length) {
 		if (hydrating && node.nodeType === 8) {
 			var comment = /** @type {Comment} */ (node);
 			if (comment.data === HYDRATION_START) depth += 1;
-			if (comment.data.startsWith(HYDRATION_END)) depth -= 1;
+			else if (comment.data[0] === HYDRATION_END) depth -= 1;
 		}
 
 		if (depth === 0 && node.nodeType === 1) {
-			assign_location(/** @type {Element} */ (node), filename, locations[j++]);
+			assign_location(/** @type {Element} */ (node), filename, locations[i++]);
 		}
+
+		node = node.nextSibling;
 	}
 }

src/internal/client/dev/equality.js

@@ -31,6 +31,14 @@ import * as w from '../warnings.js';
 	array_prototype.lastIndexOf = function (item, from_index) {
-		const index = lastIndexOf.call(this, item, from_index);
+		// we need to specify this.length - 1 because it's probably using something like
+		// `arguments` inside so passing undefined is different from not passing anything
+		const index = lastIndexOf.call(this, item, from_index ?? this.length - 1);
 
 		if (index === -1) {
-			const test = lastIndexOf.call(get_proxied_value(this), get_proxied_value(item), from_index);
+			// we need to specify this.length - 1 because it's probably using something like
+			// `arguments` inside so passing undefined is different from not passing anything
+			const test = lastIndexOf.call(
+				get_proxied_value(this),
+				get_proxied_value(item),
+				from_index ?? this.length - 1
+			);
 
@@ -37,0 +45,0 @@ if (test !== -1) {

src/internal/client/dom/blocks/css-props.js

 import { namespace_svg } from '../../../../constants.js';
-import { hydrate_anchor, hydrate_nodes, hydrating } from '../hydration.js';
+import { hydrate_anchor, hydrate_start, hydrating } from '../hydration.js';
 import { empty } from '../operations.js';
@@ -22,3 +22,3 @@ import { render_effect } from '../../reactivity/effects.js';
 		// Hydration: css props element is surrounded by a ssr comment ...
-		element = /** @type {HTMLElement | SVGElement} */ (hydrate_nodes[0]);
+		element = /** @type {HTMLElement | SVGElement} */ (hydrate_start);
 		// ... and the child(ren) of the css props element is also surround by a ssr comment
@@ -25,0 +25,0 @@ component_anchor = /** @type {Comment} */ (

src/internal/client/dom/blocks/each.js

@@ -11,3 +11,9 @@ import {
 } from '../../../../constants.js';
-import { hydrate_anchor, hydrate_nodes, hydrating, set_hydrating } from '../hydration.js';
+import {
+	hydrate_anchor,
+	hydrate_nodes,
+	hydrate_start,
+	hydrating,
+	set_hydrating
+} from '../hydration.js';
 import { clear_text_content, empty } from '../operations.js';
@@ -152,3 +158,3 @@ import { remove } from '../reconciler.js';
 			/** @type {Node} */
-			var child_anchor = hydrate_nodes[0];
+			var child_anchor = hydrate_start;
 
@@ -155,0 +161,0 @@ /** @type {import('#client').EachItem | import('#client').EachState} */

src/internal/client/dom/blocks/svelte-element.js

 import { namespace_svg } from '../../../../constants.js';
-import { hydrate_anchor, hydrate_nodes, hydrating, set_hydrate_nodes } from '../hydration.js';
+import { hydrate_anchor, hydrate_start, hydrating } from '../hydration.js';
 import { empty } from '../operations.js';
@@ -82,3 +82,3 @@ import {
 				element = hydrating
-					? /** @type {Element} */ (hydrate_nodes[0])
+					? /** @type {Element} */ (hydrate_start)
 					: ns
@@ -106,8 +106,2 @@ ? document.createElementNS(ns, next_tag)
 
-					if (hydrating && !element.firstChild) {
-						// if the element is a void element with content, add an empty
-						// node to avoid breaking assumptions elsewhere
-						set_hydrate_nodes([empty()]);
-					}
-
 					// `child_anchor` is undefined if this is a void element, but we still
@@ -114,0 +108,0 @@ // need to call `render_fn` in order to run actions etc. If the element

src/internal/client/dom/elements/attributes.js

 import { DEV } from 'esm-env';
 import { hydrating } from '../hydration.js';
 import { get_descriptors, get_prototype_of, map_get, map_set } from '../../utils.js';
-import { AttributeAliases, DelegatedEvents, namespace_svg } from '../../../../constants.js';
+import {
+	AttributeAliases,
+	DelegatedEvents,
+	is_capture_event,
+	namespace_svg
+} from '../../../../constants.js';
 import { create_event, delegate } from './events.js';
@@ -161,3 +166,4 @@ import { add_form_reset_listener, autofocus } from './misc.js';
 
-	for (key in next) {
+	// since key is captured we use const
+	for (const key in next) {
 		// let instead of var because referenced in a closure
@@ -176,7 +182,3 @@ let value = next[key];
 
-			if (
-				event_name.endsWith('capture') &&
-				event_name !== 'ongotpointercapture' &&
-				event_name !== 'onlostpointercapture'
-			) {
+			if (is_capture_event(event_name)) {
 				event_name = event_name.slice(0, -7);
@@ -183,0 +185,0 @@ opts.capture = true;

src/internal/client/dom/hydration.js

@@ -24,5 +24,9 @@ import { DEV } from 'esm-env';
 
+/** @type {import('#client').TemplateNode} */
+export let hydrate_start;
+
 /** @param {import('#client').TemplateNode[]} nodes */
 export function set_hydrate_nodes(nodes) {
 	hydrate_nodes = nodes;
+	hydrate_start = nodes && nodes[0];
 }
@@ -62,2 +66,3 @@
 					hydrate_nodes = /** @type {import('#client').TemplateNode[]} */ (nodes);
+					hydrate_start = /** @type {import('#client').TemplateNode} */ (nodes[0]);
 					return current;
@@ -64,0 +69,0 @@ }

src/internal/client/dom/operations.js

@@ -1,25 +0,11 @@
-import { hydrate_anchor, hydrate_nodes, hydrating } from './hydration.js';
+import { hydrate_anchor, hydrate_start, hydrating } from './hydration.js';
 import { DEV } from 'esm-env';
 import { init_array_prototype_warnings } from '../dev/equality.js';
+import { current_effect } from '../runtime.js';
 
-// We cache the Node and Element prototype methods, so that we can avoid doing
-// expensive prototype chain lookups.
-
-/** @type {Node} */
-var node_prototype;
-
-/** @type {Element} */
-var element_prototype;
-
-/** @type {Text} */
-var text_prototype;
-
 // export these for reference in the compiled code, making global name deduplication unnecessary
-/**
- * @type {Window}
- */
+/** @type {Window} */
 export var $window;
-/**
- * @type {Document}
- */
+
+/** @type {Document} */
 export var $document;
@@ -32,13 +18,11 @@
 export function init_operations() {
-	if (node_prototype !== undefined) {
+	if ($window !== undefined) {
 		return;
 	}
 
-	node_prototype = Node.prototype;
-	element_prototype = Element.prototype;
-	text_prototype = Text.prototype;
-
 	$window = window;
 	$document = document;
 
+	var element_prototype = Element.prototype;
+
 	// the following assignments improve perf of lookups on DOM nodes
@@ -48,4 +32,2 @@ // @ts-expect-error
 	// @ts-expect-error
-	text_prototype.__nodeValue = ' ';
-	// @ts-expect-error
 	element_prototype.__className = '';
@@ -57,2 +39,5 @@ // @ts-expect-error
 
+	// @ts-expect-error
+	Text.prototype.__nodeValue = ' ';
+
 	if (DEV) {
@@ -101,15 +86,17 @@ // @ts-expect-error
 
-	// when we _are_ hydrating, `fragment` is an array of nodes
-	const first_node = /** @type {import('#client').TemplateNode[]} */ (fragment)[0];
-
 	// if an {expression} is empty during SSR, there might be no
 	// text node to hydrate — we must therefore create one
-	if (is_text && first_node?.nodeType !== 3) {
-		const text = empty();
-		hydrate_nodes.unshift(text);
-		first_node?.before(text);
+	if (is_text && hydrate_start?.nodeType !== 3) {
+		var text = empty();
+		var dom = /** @type {import('#client').TemplateNode[]} */ (
+			/** @type {import('#client').Effect} */ (current_effect).dom
+		);
+
+		dom.unshift(text);
+		hydrate_start?.before(text);
+
 		return text;
 	}
 
-	return hydrate_anchor(first_node);
+	return hydrate_anchor(hydrate_start);
 }
@@ -134,11 +121,10 @@
 	if (is_text && next_sibling?.nodeType !== 3) {
-		const text = empty();
-		if (next_sibling) {
-			const index = hydrate_nodes.indexOf(/** @type {Text | Comment | Element} */ (next_sibling));
-			hydrate_nodes.splice(index, 0, text);
-			next_sibling.before(text);
-		} else {
-			hydrate_nodes.push(text);
-		}
+		var text = empty();
+		var dom = /** @type {import('#client').TemplateNode[]} */ (
+			/** @type {import('#client').Effect} */ (current_effect).dom
+		);
 
+		dom.unshift(text);
+		next_sibling?.before(text);
+
 		return text;
@@ -145,0 +131,0 @@ }

src/internal/client/dom/template.js

@@ -1,2 +0,2 @@
-import { hydrate_nodes, hydrating } from './hydration.js';
+import { hydrate_nodes, hydrate_start, hydrating } from './hydration.js';
 import { empty } from './operations.js';
@@ -7,3 +7,2 @@ import { create_fragment_from_html } from './reconciler.js';
 import { effect } from '../reactivity/effects.js';
-import { is_array } from '../utils.js';
 
@@ -13,3 +12,2 @@ /**
  * @param {T} dom
- * @returns {T}
  */
@@ -22,4 +20,2 @@ function push_template_node(dom) {
 	}
-
-	return dom;
 }
@@ -42,3 +38,4 @@
 		if (hydrating) {
-			return push_template_node(is_fragment ? hydrate_nodes : hydrate_nodes[0]);
+			push_template_node(is_fragment ? hydrate_nodes : hydrate_start);
+			return hydrate_start;
 		}
@@ -95,3 +92,4 @@
 		if (hydrating) {
-			return push_template_node(is_fragment ? hydrate_nodes : hydrate_nodes[0]);
+			push_template_node(is_fragment ? hydrate_nodes : hydrate_start);
+			return hydrate_start;
 		}
@@ -189,3 +187,3 @@
 
-	var node = hydrate_nodes[0];
+	var node = hydrate_start;
 
@@ -198,3 +196,4 @@ if (!node) {
 
-	return push_template_node(node);
+	push_template_node(node);
+	return node;
 }
@@ -205,4 +204,6 @@
 	if (hydrating) {
-		return push_template_node(hydrate_nodes);
+		push_template_node(hydrate_nodes);
+		return hydrate_start;
 	}
+
 	var frag = document.createDocumentFragment();
@@ -219,16 +220,15 @@ var anchor = empty();
  * @param {Text | Comment | Element} anchor
- * @param {DocumentFragment | Element | Comment} node
+ * @param {DocumentFragment | Element} dom
  */
-export function append(anchor, node) {
-	if (!hydrating) {
-		/** @type {import('#client').Dom} */
-		const dom =
-			node.nodeType === 11
-				? /** @type {import('#client').TemplateNode[]} */ ([...node.childNodes])
-				: /** @type {Element | Comment} */ (node);
+export function append(anchor, dom) {
+	if (hydrating) return;
 
-		/** @type {import('#client').Effect} */ (current_effect).dom = dom;
+	var effect = /** @type {import('#client').Effect} */ (current_effect);
 
-		anchor.before(/** @type {Node} */ (node));
-	}
+	effect.dom =
+		dom.nodeType === 11
+			? /** @type {import('#client').TemplateNode[]} */ ([...dom.childNodes])
+			: /** @type {Element | Comment} */ (dom);
+
+	anchor.before(/** @type {Node} */ (dom));
 }

src/internal/client/render.js

@@ -134,4 +134,2 @@ import { DEV } from 'esm-env';
 
-	let hydrated = false;
-
 	try {
@@ -160,3 +158,2 @@ // Don't flush previous effects to ensure order of outer effects stays consistent
 			set_hydrating(false);
-			hydrated = true;
 
@@ -163,0 +160,0 @@ return instance;

src/version.js

@@ -9,3 +9,3 @@ // generated during release, do not modify
  */
-export const VERSION = '5.0.0-next.141';
+export const VERSION = '5.0.0-next.142';
 export const PUBLIC_VERSION = '5';

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

2094090

increased by0.06%

Lines of code

45814

increased by0.04%

No dependency changes