All files / src/internal/client/dom/blocks svelte-component.js

100% Statements 42/42
100% Branches 10/10
100% Functions 1/1
100% Lines 40/40

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 412x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 83x 35x 35x 83x 83x 83x 83x 83x 83x 83x 83x 162x 158x 162x 71x 71x 71x 158x 162x 142x 142x 83x 83x 83x 35x 35x 83x  
/** @import { TemplateNode, Dom, Effect } from '#client' */
import { block, branch, pause_effect } from '../../reactivity/effects.js';
import { hydrate_next, hydrate_node, hydrating } from '../hydration.js';
 
/**
 * @template P
 * @template {(props: P) => void} C
 * @param {TemplateNode} anchor
 * @param {() => C} get_component
 * @param {(anchor: TemplateNode, component: C) => Dom | void} render_fn
 * @returns {void}
 */
export function component(anchor, get_component, render_fn) {
	if (hydrating) {
		hydrate_next();
	}
 
	/** @type {C} */
	let component;
 
	/** @type {Effect | null} */
	let effect;
 
	block(() => {
		if (component === (component = get_component())) return;
 
		if (effect) {
			pause_effect(effect);
			effect = null;
		}
 
		if (component) {
			effect = branch(() => render_fn(anchor, component));
		}
	});
 
	if (hydrating) {
		anchor = hydrate_node;
	}
}