@depup/svelte 5.53.3-depup.0

package/src/internal/client/dom/css.js

@@ -0,0 +1,33 @@
+import { DEV } from 'esm-env';
+import { register_style } from '../dev/css.js';
+import { effect } from '../reactivity/effects.js';
+import { create_element } from './operations.js';
+
+/**
+ * @param {Node} anchor
+ * @param {{ hash: string, code: string }} css
+ */
+export function append_styles(anchor, css) {
+	// Use `queue_micro_task` to ensure `anchor` is in the DOM, otherwise getRootNode() will yield wrong results
+	effect(() => {
+		var root = anchor.getRootNode();
+
+		var target = /** @type {ShadowRoot} */ (root).host
+			? /** @type {ShadowRoot} */ (root)
+			: /** @type {Document} */ (root).head ?? /** @type {Document} */ (root.ownerDocument).head;
+
+		// Always querying the DOM is roughly the same perf as additionally checking for presence in a map first assuming
+		// that you'll get cache hits half of the time, so we just always query the dom for simplicity and code savings.
+		if (!target.querySelector('#' + css.hash)) {
+			const style = create_element('style');
+			style.id = css.hash;
+			style.textContent = css.code;
+
+			target.appendChild(style);
+
+			if (DEV) {
+				register_style(css.hash, style);
+			}
+		}
+	});
+}

package/src/internal/client/dom/elements/actions.js

@@ -0,0 +1,43 @@
+/** @import { ActionPayload } from '#client' */
+import { effect, render_effect } from '../../reactivity/effects.js';
+import { safe_not_equal } from '../../reactivity/equality.js';
+import { deep_read_state, untrack } from '../../runtime.js';
+
+/**
+ * @template P
+ * @param {Element} dom
+ * @param {(dom: Element, value?: P) => ActionPayload<P>} action
+ * @param {() => P} [get_value]
+ * @returns {void}
+ */
+export function action(dom, action, get_value) {
+	effect(() => {
+		var payload = untrack(() => action(dom, get_value?.()) || {});
+
+		if (get_value && payload?.update) {
+			var inited = false;
+			/** @type {P} */
+			var prev = /** @type {any} */ ({}); // initialize with something so it's never equal on first run
+
+			render_effect(() => {
+				var value = get_value();
+
+				// Action's update method is coarse-grained, i.e. when anything in the passed value changes, update.
+				// This works in legacy mode because of mutable_source being updated as a whole, but when using $state
+				// together with actions and mutation, it wouldn't notice the change without a deep read.
+				deep_read_state(value);
+
+				if (inited && safe_not_equal(prev, value)) {
+					prev = value;
+					/** @type {Function} */ (payload.update)(value);
+				}
+			});
+
+			inited = true;
+		}
+
+		if (payload?.destroy) {
+			return () => /** @type {Function} */ (payload.destroy)();
+		}
+	});
+}

package/src/internal/client/dom/elements/attachments.js

@@ -0,0 +1,33 @@
+/** @import { Effect } from '#client' */
+import { branch, effect, destroy_effect, managed } from '../../reactivity/effects.js';
+
+// TODO in 6.0 or 7.0, when we remove legacy mode, we can simplify this by
+// getting rid of the block/branch stuff and just letting the effect rip.
+// see https://github.com/sveltejs/svelte/pull/15962
+
+/**
+ * @param {Element} node
+ * @param {() => (node: Element) => void} get_fn
+ */
+export function attach(node, get_fn) {
+	/** @type {false | undefined | ((node: Element) => void)} */
+	var fn = undefined;
+
+	/** @type {Effect | null} */
+	var e;
+
+	managed(() => {
+		if (fn !== (fn = get_fn())) {
+			if (e) {
+				destroy_effect(e);
+				e = null;
+			}
+
+			if (fn) {
+				e = branch(() => {
+					effect(() => /** @type {(node: Element) => void} */ (fn)(node));
+				});
+			}
+		}
+	});
+}